html-table tbody加滾動條

思路就是 
1，把tbody設置成display:block，而後就對其高度設置一個固定值，overflow設置成auto。 
2，把thead的tr設置成display:block。 
3，由於都設置成block因此要給td手動添加寬度 width:200px 
親測有效

<table class="table"> 
<thead> 
<tr> 
<th>Id</th> 
<th>Name</th> 
<th>Category</th> 
<th>MonthAmount</th> 
<th>hasBackUp</th> 
<th>score</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
<tr> 
<td>23</td> 
<td>South Bearing</td> 
<td>Glass/Material</td> 
<td>1234444</td> 
<td>TRUE</td> 
<td>3456.00</td> 
</tr> 
</tbody> 
</table>

css代碼:

.table thead tr { 
display:block; 
} 
.table tbody { 
display: block; 
height: 200px; 
overflow: auto; 
} 
.table th { 
width:20%; 
} 
.table td { 
width:20%; 
}

開源中國改版以後第一次寫博客耶，新版本再熟悉中