現在，越來越多的網站都會在數據展示頁面上使用表格來呈現數據。但是隨著數據量的增加，表格的長度往往也會增加。這就給用戶的使用體驗產生了一定的困難。尤其是在滾動表格的時候，表頭往往都會隨著表格滾動而消失，不方便查看。

針對這種情況，我們可以使用CSS來實現表頭固定的效果。讓表格滾動的時候，表頭依舊固定在頁面的頂部，不會消失。下面，我們就來介紹一下如何使用純CSS來實現表頭固定的效果。

<style>
/* 定義表格樣式 */
table {
border-collapse: collapse;
width: 100%;
}
th,
td {
padding: 8px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background-color: #f2f2f2;
}
/* 定義表頭樣式 */
.fixed-header th {
position: sticky;
top: 0;
z-index: 2;
}
/* 定義滾動區域樣式 */
.scrollable {
overflow-y: scroll;
height: 200px;
}
</style>

上面的CSS樣式中，我們定義了表格和表頭的樣式，并使用了position: sticky屬性來使表頭固定在頁面的頂部。同時，我們還定義了一個滾動區域的樣式。滾動區域的高度可以根據實際需求來調整。

<div class="scrollable">
<table>
<thead class="fixed-header">
<tr>
<th>序號</th>
<th>姓名</th>
<th>年齡</th>
<th>地址</th>
<th>電話</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>小明</td>
<td>18</td>
<td>北京市東城區</td>
<td>18888888888</td>
</tr>
<tr>
<td>2</td>
<td>小紅</td>
<td>20</td>
<td>北京市西城區</td>
<td>16666666666</td>
</tr>
<tr>
<td>3</td>
<td>小剛</td>
<td>22</td>
<td>北京市朝陽區</td>
<td>13333333333</td>
</tr>
</tbody>
</table>
</div>

上面的代碼中，我們將表格放在了一個包含滾動區域的div元素里面，這樣就可以使用overflow-y屬性來實現表格縱向滾動。同時，將表頭的樣式設置為fixed-header，這樣更容易實現表頭固定。

經過上面的代碼調整，我們就可以實現表格固定表頭的效果了。當然，這只是一種最基礎的實現方式，你可以通過調整相關CSS樣式來實現更多的效果。祝你愉快的使用CSS來打造更美觀、更易用的數據展示頁面！