table表头固定问题

table表头固定问题

原生的table表头在表格滚动时候无法固定，可以使用以下的方法进行模拟

1. 双table法

表头和表体各用一个table，这样会产生表格列对不齐的问题，可以使用colgroup和col来对齐，或者直接设置th，td的宽度

2. 单table修改样式方法

设置表格体为display:block，表格head和表格body的行都是display:table

.tb tbody{display:block;height:300px;overflow:hidden;overflow-y:scroll;}
.tb thead,.tb tbody tr{
    display:table;width:100%;table-layout:fixed;
}

 

参考: https://blog.csdn.net/hualele/article/details/52993315
　　  https://blog.csdn.net/qq_36340642/article/details/79353179