CSS垂直導航欄是網站設計中常用的一種導航欄形式。它可以使網站的導航更加簡潔明了，方便用戶瀏覽網站內容。下面是一段常用的CSS代碼，可以實現一個簡潔的垂直導航欄：

.nav {
list-style: none;
padding: 0;
margin: 0;
width: 200px;
background-color: #f2f2f2;
}
.nav li {
position: relative;
}
.nav li a {
display: block;
padding: 10px 20px;
color: #333;
text-decoration: none;
}
.nav li:hover >ul {
display: block;
}
.nav ul {
display: none;
position: absolute;
top: 0;
left: 100%;
width: 200px;
background-color: #f2f2f2;
}
.nav ul li a {
padding: 10px 20px;
color: #333;
text-decoration: none;
}
.nav ul ul {
left: 100%;
top: 0;
}
.nav ul ul ul {
left: 100%;
top: 0;
}

其中.nav是導航欄的容器，它設置了一些基本的樣式，如寬度和背景色。每個導航選項都是一個內部嵌套的列表項li，每個列表項都包含一個鏈接a。其中，a標簽使用display:block來將標簽改為塊級元素，方便設置樣式。每個頁面下面的子頁面都是使用ul嵌套來實現的。

在這個代碼中，導航欄選項的樣式是通過偽類:hover實現的，當用戶將鼠標懸停在某個選項上時，其子頁面會顯示出來。

以上是一個簡單的實現垂直導航欄的CSS代碼。你可以根據自己的需求和喜好來對其進行修改和擴展。