自適應寬度並Y軸滾動

時間 2019-11-13

標籤自適應寬度滾動欄目 CSS 简体版

原文原文鏈接

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBspanC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>自適應寬度並Y軸滾動</title>
<script type="text/javascript" src="/t/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(function(){
	$("#btn").click(function(){
		var w = $("#tb").width();
		//alert(w);
		//$("#tb").width(w+20);
		$("#tb").find("td").css("padding-right","20px");//加上
	});
});
</script>
</head>
<body>
<input type="button" value="click" id="btn" />
<span style="height:200px;overflow-x:hidden;overflow-y:auto;border:1px solid red;display:inline-block;">
<table id="tb" border=1 >
<tr><td>AAAAAAAAAAAAAaaaa</td></tr>
<tr><td>AAAAAAAAAAAAAaaaa</td></tr>
<tr><td>AAAAAAAAAAAAAaaaa</td></tr>
<tr><td>AAAAAAAAAAAAAaassssssssaA</td></tr>
<tr><td>AAAAAAAAAAAAAaaaa</td></tr>
<tr><td>AAAAAAAAAAAAAaaaa</td></tr>

<tr><td>AAAAAAAAAAAAAaaaa</td></tr>
<tr><td>AAAAAAAAAAAAAaaaa</td></tr>

<tr><td>AAAAAAAAAAAAAaaaa</td></tr>

<tr><td>AAAAAAAAAAAAAaaaa</td></tr>
</table>
</span>
</body>
</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。