Sticky table headers

Try to scroll the main content of table to see the header sticks to the top.
<table>
<thead>
<tr>
<th class="header">
...
</th>
<!-- Repeat other header column ... -->
</tr>
</thead>
<tbody>
</tbody>
</table>
.header {
/* Background color */
background-color: #ddd;
/* Stick to the top */
position: sticky;
top: 0;
/* Displayed on top of other rows when scrolling */
z-index: 9999;
}

See also

Sticky header

Sticky sections

Sticky table column