我在项目中使用html表。
我想使我的html表标题和第一行冻结。我知道如何使收割台冻结。但我无法修复第一排冻结。有人能帮我吗?
感谢
使用代码段修订
我只想把特色/突出显示的(第一)行放在thead
组中,它也会与您的标题行一起固定。
<style>
table { width:100%; }
table thead { position:fixed; }
table thead tr th { text-align: left; }
table tbody { position:absolute; top:60px; }
</style>
<table>
<thead>
<tr><th>Header</th></tr>
<tr><td>Highlighted Row</td></tr>
</thead>
<tbody>
<tr><td>Row 1</td></tr>
<tr><td>Row 2</td></tr>
<tr><td>Row 3</td></tr>
<tr><td>Row 4</td></tr>
<tr><td>Row 5</td></tr>
<tr><td>Row 6</td></tr>
<tr><td>Row 7</td></tr>
<tr><td>Row 8</td></tr>
<tr><td>Row 9</td></tr>
<tr><td>Row 10</td></tr>
</tbody>
</table>
我认为@Darshak Shekhda的回答已经足够了,但如果您想要更多解释,可以参考JSFiddle示例。您可以使用
{ position:absolute;
overflow:scroll;
}
来实现您的设计。您可以使用:nth-child(rowNumber){
position:absolute;
overflow:scroll;
}
以选择所需的行。希望这能有所帮助。