61,112
社区成员
发帖
与我相关
我的任务
分享
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>表格 </title>
<style type="text/css">
*{padding:0;margin:0;border:0;}
table {border-collapse:collapse;}
table td{border-collapse:collapse;width:100px;height:25px;font:14px Arial;}
#xCtrl{position:relative;width:820px;height:280px;overflow:hidden;border:1px solid red}
#yCtrl{overflow-y:scroll;width:1020px;height:100%;}
.tableAbox{width:1000px;overflow:hidden;}/*.yCtrl .tableAbox 宽高一致*/
.tableA{width:1000px;}
.tableA td{background:#eee;color:#f00;}
.tableB{position:absolute;bottom:16px;right:-186px;width:490px;overflow:hidden;}/*宽度 与 脚本 宽度 保持一致*/
.tableB td{background:#f00;color:#eee;}
</style>
</head>
<body>
<div id="xCtrl">
<div id="yCtrl">
<div class="" style="width:1000px;">
<div class="tableAbox">
<table cellpadding="0" cellspacing="0" class="tableA"> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> <td>6 </td> <td>7 </td> <td>8 </td> <td>9 </td> <td>10 </td> </tr> </table>
</div>
<table cellpadding="0" cellspacing="0" class="tableB"> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> </tr> <tr> <td>1 </td> <td>2 </td> <td>3 </td> <td>4 </td> <td>5 </td> </tr> </table>
</div>
</div>
</div>
</body>
</html>