css实现table 固定显示顶部
<style>
.table-container {
overflow-x: auto; /* 水平滚动 */
max-height: 400px; /* 设置表格容器的最大高度,以便有滚动条出现 */
position: relative;
}
table {
width: 100%;
border-collapse: collapse;
}
th, td {
padding: 8px;
text-align: center;
height: 100px;
}
.sticky-header {
position: sticky;
top: 0;
background-color: #f2f2f2;
z-index: 1;
}
</style>
<div class="table-container">
<table>
<thead class="sticky-header">
<tr>
<th rowspan="2">列头1</th>
<th colspan="2">列头2</th>
</tr>
<tr>
<th>列头21</th>
<th>列头22</th>
</tr>
</thead>
<tbody>
<tr>
<td>数据1</td>
&