首页 > 代码库 > bootstrap表头固定
bootstrap表头固定
css:
//表头固定
.fixed_headers thead tr {
display: block;
position: relative;
}
.fixed_headers tbody {
display: block;
overflow: auto;
height: 250px;
}
//每列宽度
.fixed_headers td:nth-child(1),
.fixed_headers th:nth-child(1) {
min-width: 250px;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
}
.fixed_headers td:nth-child(2),
.fixed_headers th:nth-child(2) {
min-width: 200px;
}
.fixed_headers td:nth-child(3),
.fixed_headers th:nth-child(3) {
min-width: 200px;
}
.fixed_headers td:nth-child(4),
.fixed_headers th:nth-child(4) {
min-width: 200px;
}
.fixed_headers td:nth-child(5),
.fixed_headers th:nth-child(5) {
min-width: 200px;
}
.fixed_headers td:nth-child(6),
.fixed_headers th:nth-child(6) {
min-width: 200px;
}
.fixed_headers td:nth-child(7),
.fixed_headers th:nth-child(7) {
min-width: 200px;
}
.fixed_headers td:nth-child(8),
.fixed_headers th:nth-child(8) {
min-width: 200px;
}
html:
<table class="table table-hover coma-base-table fixed_headers">
<thead>
<tr style="white-space: nowrap">
<th style="font-weight: bold;">被参控公司</th>
<th style="font-weight: bold;">参控关系</th>
<th style="font-weight: bold;">直接持股比例</th>
</tr>
</thead>
<tbody>
..........
</tbody>
</table>
bootstrap表头固定
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。