css 和表头对齐 表格_CSS设置table下tbody滚动条与thead对齐的方法
客户有个需求,table的表头不动,但是表格内容需要限定高度加上滚动条,如果直接在tbody加上高度和overflow-y:scroll,thead的表头就对不齐。下面就是解决这个问题的方法:效果如下:威易网CSS教程table tbody {display:block;height:195px;overflow-y:scroll;}table thead, tbody tr {display:t
·
客户有个需求,table的表头不动,但是表格内容需要限定高度加上滚动条,如果直接在tbody加上高度和overflow-y:scroll,thead的表头就对不齐。下面就是解决这个问题的方法:
效果如下:
威易网CSS教程table tbody {
display:block;
height:195px;
overflow-y:scroll;
}
table thead, tbody tr {
display:table;
width:100%;
table-layout:fixed;
}
table thead {
width: calc( 100% - 1em )
}
table thead th{ background:#ccc;}
姓名年龄出生年月手机号码单位
张三181990-9-913682299090阿里巴巴张三封181990-9-913682299090阿里巴巴与四十大盗张小三181990-9-913682299090腾讯科技张三181990-9-913682299090浏阳河就业张三疯子181990-9-913682299090阿里巴巴张三181990-9-913682299090阿里巴巴张大三181990-9-913682299090阿里巴巴张三五181990-9-913682299090阿里巴巴张刘三181990-9-913682299090阿里巴巴张三181990-9-913682299090阿里巴巴更多推荐
已为社区贡献4条内容
所有评论(0)