CSS導航帶豎線怎么寫？

在CSS中，可以使用偽元素（::before或::after）或者邊框（border）來實現(xiàn)導航帶豎線的效果。

我們需要創(chuàng)建一個包含導航鏈接的HTML結構，

<ul class="nav">
  <li><a href="#">鏈接1</a></li>
  <li><a href="#">鏈接2</a></li>
  <li><a href="#">鏈接3</a></li>
</ul>

我們可以使用CSS來添加豎線，以下是使用偽元素實現(xiàn)的示例：

.nav li {
  position: relative;
}
.nav li::before {
  content: "|";
  position: absolute;
  top: 0;
  right: -10px;
}

在這個示例中，我們給每個導航項添加了一個偽元素，內容為豎線（|），并將其定位在右側，偏移量為-10px，以實現(xiàn)豎線在鏈接右側的效果。

我們也可以使用邊框來實現(xiàn)豎線效果，

.nav li {
  border-right: 1px solid #000;
}

在這個示例中，我們給每個導航項添加了一個右邊框，顏色為黑色（#000），寬度為1px，以實現(xiàn)豎線效果。

無論使用哪種方法，都可以實現(xiàn)導航帶豎線的效果，具體使用哪種方法取決于你的需求和設計。