CSS可以實(shí)現(xiàn)當(dāng)頁面滾動(dòng)時(shí)讓頭部固定，這種效果常用于網(wǎng)頁的導(dǎo)航欄和頁眉上。

.fixed-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 9999;
}

代碼中定義了一個(gè)類名為.fixed-header，并設(shè)置css屬性position:fixed，這讓元素脫離文檔流，不再隨頁面滾動(dòng)而移動(dòng)。top:0和left:0則讓元素緊貼在頁面的左上角。width:100%讓元素在寬度上充滿整個(gè)瀏覽器窗口。z-index是指元素在垂直層面上的顯示順序，值越大越靠上。

接下來，我們可以在HTML中給需要固定頭部的元素添加這個(gè)類名，如下：

<nav class="fixed-header">
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">產(chǎn)品</a></li>
<li><a href="#">關(guān)于我們</a></li>
<li><a href="#">聯(lián)系我們</a></li>
</ul>
</nav>

上述代碼中，nav元素是需要固定頭部的導(dǎo)航欄。我們只需要給這個(gè)元素添加fixed-header類名即可實(shí)現(xiàn)頭部固定。之后頁面滾動(dòng)時(shí)，導(dǎo)航欄就會(huì)一直保持在瀏覽器窗口的頂部了。