如何冻结HTML表格中的标题行？

Question

我正在使用HTML表并已应用垂直滚动,现在我想在滚动期间冻结标题行.我怎样才能做到这一点？

Answer 1

HTML:

<table>
 <tr id="header-row">
  <th>header col 1</th>
  <th>header col 2</th>
 </tr>
 <tr>
  <td>data</td>
  <td>data</td>
 <tr>
 <tr>...</tr>
 ...
</table>

CSS:

#header-row { position:fixed; top:0; left:0; }
table {padding-top:15px; }

Answer 2

一种简单的方法是创建 2 个表并固定列宽。第一个充当标题

下面的第二个表是滚动条所在的位置，并且仅显示数据。