CSS固定底部和頭部 CSS（層疊樣式表）是構建網站設計的重要組成部分，通過CSS可以實現各種效果，如圖像大小、字體顏色、邊距、對齊以及頁面布局等。本篇文章主要介紹如何通過CSS固定網站底部和頭部。 固定底部 在網站制作過程中，有時需要將網站底部固定在頁面的底部。通過CSS實現底部固定可以讓網站看起來更加專業和美觀。下面是CSS代碼樣例：

footer {
position: fixed;
left:0;
bottom: 0;
width: 100%;
background-color: #333;
color:#fff;
text-align: center;
padding: 20px;
}

上述代碼將底部元素footer的位置設置為fixed，它的left（左側）和bottom（底部）分別為0，width（寬度）設為100%，這樣就能確保該元素始終位于頁面的底部。background-color（背景顏色）、color（文本顏色）和text-align（對齊方式）可以根據需要自行修改。 固定頭部 除了底部之外，有時也需要將網站頭部固定在頁面的頂部。固定頭部可以讓用戶在瀏覽過程中更加方便和快捷。下面是CSS代碼樣例：

header {
position: fixed;
top:0;
left:0;
width: 100%;
background-color: #333;
color:#fff;
text-align: center;
padding: 20px;
z-index:999;
}

上述代碼將頭部元素header的位置設置為fixed，它的top（頂部）和left（左側）均為0，其寬度也設為100%。在CSS中，z-index屬性控制元素的位置，999表示該元素在其他元素之上，起到固定頭部的效果。同樣，background-color、color、text-align、padding等屬性也可以根據需要進行修改。 總結 通過CSS可以輕松地實現網站底部和頭部的固定效果，這種效果不僅提升了網站的外觀，也讓用戶可以更加方便快捷地瀏覽網頁。在實踐中，我們要注重細節，讓頁面布局更加完美。