豎向導航欄是網(wǎng)頁設計中常見的一種導航形式。它通常呈現(xiàn)為一列鏈接，以垂直方式顯示。CSS可以使我們實現(xiàn)各種不同樣式的豎向導航欄。

/* 簡單的豎向導航欄 */
.nav {
display: flex;
flex-direction: column;
}
.nav a {
padding: 10px;
text-decoration: none;
color: #333;
}
/* 鼠標懸停時改變背景色 */
.nav a:hover {
background-color: #eee;
}
/* 在背景上添加圖標 */
.nav a:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
margin-right: 10px;
background-image: url(icon.png);
background-size: cover;
}
/* 被選中的導航鏈接樣式 */
.nav a.active {
background-color: #ddd;
}

以上代碼實現(xiàn)了一個簡單的豎向導航欄，鏈接之間以垂直方式排列，鼠標懸停時改變背景顏色，鏈接前面放置了一個圖標。通過定義.active類，我們還可以定義選中鏈接的樣式。

還可以實現(xiàn)更多復雜的樣式，比如有子菜單的導航欄、帶有分割線的導航欄等等。對于使用豎向導航欄進行網(wǎng)站開發(fā)和設計的開發(fā)人員來說，掌握好CSS樣式的使用是非常重要的。