<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script type="text/javascript" src= 'jquery.js'></script>
<script type="text/javascript">
$(function(){
table_align('.topT','.bottomT',6)
})
function table_align(table1,table2,tdnums){
for(var i=1;i<tdnums;i++){
var tdclass = ".td_"+i;
var thwidth=$(table1).find(tdclass).width();
$(table2).find(tdclass).width(thwidth);
}
}
</script>
<style type="text/css">
.topT{
margin-bottom: 0px;
}
.bottom{
height: 100px;
overflow-y:auto;
}
</style>
</head>
<body>
<div class='top'>
<table class='table table-bordered topT'>
<tr>
<td class='td_1'>aaaaaaaaaa</td>
<td class='td_2'>aaaaaaaaaa</td>
<td class='td_3'>aaaaaaaaaa</td>
<td class='td_4'>aaaaaaaaaa</td>
<td class='td_5'>aaaaaaaaaa</td>
<td class='td_6'>aaaaaaaaaa</td>
</tr>
</table>
</div>
<div class='bottom'>
<table class='table table-bordered bottomT'>
<tr>
<td class='td_1'>aaaaaaaaaa</td>
<td class='td_2'>aaaaaaaaaa</td>
<td class='td_3'>aaaaaaaaaa</td>
<td class='td_4'>aaaaaaaaaa</td>
<td class='td_5'>aaaaaaaaaa</td>
<td class='td_6'>aaaaaaaaaa</td>
</tr>
<tr>
<td class='td_1'>aaaaaaaaaa</td>
<td class='td_2'>aaaaaaaaaa</td>
<td class='td_3'>aaaaaaaaaa</td>
<td class='td_4'>aaaaaaaaaa</td>
<td class='td_5'>aaaaaaaaaa</td>
<td class='td_6'>aaaaaaaaaa</td>
</tr>
<tr>
<td class='td_1'>aaaaaaaaaa</td>
<td class='td_2'>aaaaaaaaaa</td>
<td class='td_3'>aaaaaaaaaa</td>
<td class='td_4'>aaaaaaaaaa</td>
<td class='td_5'>aaaaaaaaaa</td>
<td class='td_6'>aaaaaaaaaa</td>
</tr>
<tr>
<td class='td_1'>aaaaaaaaaa</td>
<td class='td_2'>aaaaaaaaaa</td>
<td class='td_3'>aaaaaaaaaa</td>
<td class='td_4'>aaaaaaaaaa</td>
<td class='td_5'>aaaaaaaaaa</td>
<td class='td_6'>aaaaaaaaaa</td>
</tr>
<tr>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
</tr>
<tr>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
</tr>
<tr>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
<td>aaaaaaaaaa</td>
</tr>
</table>
</div>
</body>
</html>
想法就是取得除了最后一个td之前的td宽度 ，然后赋予相对应的td
最后一个因为表格是用了bootstrap的自适应表格宽度 自适应，所以不用修改
