表格添加滚动条

 1 <style>
 2 table {
 3 /*设置相邻单元格的边框间的距离*/
 4 border-spacing: 0;
 5 /*表格设置合并边框模型*/
 6 border-collapse: collapse;
 7 text-align: center;
 8 }
 9 /*关键设置 tbody出现滚动条*/
10 table tbody {
11 display: block;
12 height: 80px;
13 overflow-y: scroll;
14 }
15 
16 table thead,
17 tbody tr {
18 display: table;
19 width: 100%;
20 table-layout: fixed;
21 }
22 /*关键设置：滚动条默认宽度是16px 将thead的宽度减16px*/
23 table thead {
24 width: calc( 100% - 1em)
25 }
26 
27 
28 table thead th {
29 background: #ccc;
30 }
31 
32 </style>