<div class="table">
<div class="table-head">
<table>
<colgroup>
<col style="width: 80px;" /><col />
</colgroup>
<thead>
<tr style="height: 45px;">
<th>序号</th>
<th>我只是用来测试的</th>
<th>我只是用来测试的</th>
<th>我只是用来测试的</th>
<th>我来测试的</th>
<th>我来测试的</th>
</tr>
</thead>
</table>
</div>
<div class="table-body">
<table>
<colgroup><col style="width: 80px;" /><col /></colgroup>
<tbody>
<tr>
<td>1</td>
<td>我只是用来测试的</td>
<td>我来测试的</td>
<td>我来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>2</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>3</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>4</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>5</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>6</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>7</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>8</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>9</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>10</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>11</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>12</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>13</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>14</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>15</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- 1、使用了colgroup标签,来对上下两个表格的列宽进行了定义,让他们保持一致。
2、上边的div .table-head添加了样式 padding-right : 17px ,这个宽度是为了保证跟下边的div .table-body的滚动条保持一致,同时下边的表格.table-body添加了样式 overflow-y : scroll ; -->
<div class="table-head">
<table>
<colgroup>
<col style="width: 80px;" /><col />
</colgroup>
<thead>
<tr style="height: 45px;">
<th>序号</th>
<th>我只是用来测试的</th>
<th>我只是用来测试的</th>
<th>我只是用来测试的</th>
<th>我来测试的</th>
<th>我来测试的</th>
</tr>
</thead>
</table>
</div>
<div class="table-body">
<table>
<colgroup><col style="width: 80px;" /><col /></colgroup>
<tbody>
<tr>
<td>1</td>
<td>我只是用来测试的</td>
<td>我来测试的</td>
<td>我来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>2</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>3</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>4</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>5</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>6</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>7</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>8</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>9</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>10</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>11</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>12</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>13</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>14</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
<tr>
<td>15</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
<td>我只是用来测试的</td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- 1、使用了colgroup标签,来对上下两个表格的列宽进行了定义,让他们保持一致。
2、上边的div .table-head添加了样式 padding-right : 17px ,这个宽度是为了保证跟下边的div .table-body的滚动条保持一致,同时下边的表格.table-body添加了样式 overflow-y : scroll ; -->