CSS 導航條是網站設計中的常見組件之一，它可以使用戶更方便地瀏覽頁面內容。設置 CSS 導航條很簡單，接下來我們來介紹一下。
首先，我們需要使用 HTML 創建導航條的基本結構。常用的 HTML 元素有 ul 和 li，代碼如下：

<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">關于我們</a></li>
<li><a href="#">服務</a></li>
<li><a href="#">聯系我們</a></li>
</ul>

在 CSS 中，我們可以通過改變導航條的樣式來美化它。以下是設置樣式的代碼：

/* 移除 ul 默認的樣式 */
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
/* 設置導航條樣式 */
ul li {
display: inline-block;
margin-right: 10px;
}
/* 設置鏈接樣式 */
li a {
display: block;
padding: 5px 10px;
text-decoration: none;
color: #444;
background-color: #f7f7f7;
}
/* 鼠標懸停時鏈接樣式 */
li a:hover {
color: #fff;
background-color: #333;
}

以上代碼中，我們通過設置 ul 和 li 的樣式來改變導航條的排版和間隔。同時，我們還設置了鏈接的背景色、顏色和鼠標懸停時的樣式。
設置 CSS 導航條非常簡單，只需要熟悉 HTML 和 CSS 的語法，就能輕松地實現美觀的導航條功能。