CSS是網頁設計中必不可少的一部分，其中浮動是常見效果之一。在網頁設計中，經常需要實現一個固定在頁面頂部的浮動頭部，本文將介紹如何用CSS實現這個效果。

//html
<header>這是頭部</header>
<div class="content">
這是頁面主體內容
</div>
//css
header {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 50px;
background-color: #333;
color: #fff;
padding: 10px;
}
.content {
margin-top: 50px;
/*因為頭部高度是50px，所以margin-top要設置為50px*/
}

首先，在HTML中創建一個header標簽用于包裹頭部內容，其余頁面內容需要包裹在一個div中。在CSS中，使用position屬性將header標簽定位到頁面頂部，并使用height屬性設置頭部的高度。padding屬性用于設置頭部內容的內邊距，為了避免頭部內容與頁面頂部重疊，需要將主體內容的頂部外邊距設置得與頭部高度相同。最后，設置背景色和文字顏色。

通過以上CSS樣式，一個浮動頭部就成功實現了。這個效果不僅可以讓頁面更加美觀，而且可以方便地讓用戶進行頁面導航，提高用戶體驗。