CSS设置table下tbody的滚动条

今天碰到一个关于对tabel的表的滚动事件，需求是表头不动，改变的是tbody，如果tbody里面的内容过多，让其进行滚动事件。

首先想到的就是利用css中overflow-y:scroll; 来进行内容的滚动，但是在处理tabel的display状态时，就将tabel表的布局给打乱了，如果给tabel的父级进行限制，则这个表会进行滚动。。。

在css上设置如下代码就可以了

table tbody {display:block;height:200px;overflow-y:scroll;-webkit-overflow-scrolling: touch; // 为了滚动顺畅 }table tbody::-webkit-scrollbar {display: none; // 隐藏滚动条}table thead, tbody tr {display:table;width:100%;table-layout:fixed;}table thead {width: calc( 100% - 1em )}table thead th{ background:#ccc;}