< p >在網頁設計中，導航欄是一個非常重要的組件，可以幫助用戶快速地找到自己需要的信息。為了實現一個美觀、易用的導航欄，我們需要使用 CSS 樣式來進行設置。下面我們就來學習如何設置導航欄的 CSS 樣式。< pre >nav { background-color: #333; overflow: hidden; padding: 0 20px; font-size: 28px; } nav a { float: left; color: white; text-align: center; padding: 14px 16px; text-decoration: none; } nav a:hover { background-color: #ddd; color: black; }< p >首先，我們需要給導航欄的nav標簽設置一些基礎樣式，比如背景顏色、字體大小、內邊距等。上面的代碼中，我們將導航欄的背景顏色設為黑色，大小為 28px，內邊距設為 0 20px。< p >接下來，我們需要設置導航欄的鏈接樣式。通過設置nav a標簽的樣式，我們可以實現鏈接的左浮動、白色字體、居中顯示、內邊距等樣式。還可以通過設置text-decoration: none來去掉鏈接下劃線。< p >最后，我們為導航欄的鏈接設置:hover樣式，當用戶將鼠標移動到鏈接上方時，鏈接的背景顏色會變成灰色，文字顏色變為黑色。< p >通過上述代碼，我們可以輕松設置出一個簡潔美觀、易用的導航欄。當然，實際項目中根據需要可能會有更復雜的樣式設置，需要根據項目需求進行調整。