今天我們來學習一下如何使用CSS來給導航條增加分割線。 首先，我們需要在HTML中創建一個結構良好的導航欄。通常情況下，我們會使用無序列表（ul）和列表項（li）來創建導航欄，如下：

<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>

接下來，我們可以使用CSS來為每個列表項添加分割線。我們可以使用偽元素::after為每個列表項添加一條水平線，如下：

ul li::after {
content: "";
display: block;
height: 1px;
background-color: #ccc;
margin: 10px 0;
}

這段代碼中，我們使用了content屬性來設置元素的內容為空，然后我們將其設置為塊級元素（display: block）。然后，我們設置了元素的高度為1像素，背景顏色為灰色，并將其上下間距設置為10像素。 最后，我們需要將最后一個列表項的分割線刪除。我們可以使用`:last-child`偽類選擇器來選取最后一個列表項，然后用以下代碼將其分割線去掉：

ul li:last-child::after {
display: none;
}

現在，我們的導航欄分割線已經完成了。完整的CSS代碼如下：

ul li::after {
content: "";
display: block;
height: 1px;
background-color: #ccc;
margin: 10px 0;
}
ul li:last-child::after {
display: none;
}

希望這篇文章能夠幫助你更好地了解如何使用CSS為導航條添加分割線。