CSS豎虛線是一種非常常見的樣式效果，通常被用于網頁設計中的分割線、導航欄、列表等，可以讓頁面看起來更加整齊美觀。下面將介紹如何使用CSS實現豎虛線的效果。

/* 以下是CSS代碼 */
.line{
border-left: 1px dotted #ccc;
height: 30px; /* 高度根據需求自定義 */
}

以上代碼中，我們先創建了一個類名為line的樣式，在該樣式中使用了border-left屬性來創建豎虛線效果。其中，1px表示線條的寬度，dotted表示線條的樣式，#ccc表示線條的顏色。另外，還需要設置height屬性來確定線條的高度，讓整個豎虛線效果可以正常展示。

接下來，我們可以在HTML頁面中使用該樣式：

<div class="line"></div>

我們可以看到，在以上HTML代碼中，我們使用了div元素來創建豎虛線，同時添加了line類名，這樣就可以應用以上CSS樣式中定義的豎虛線效果。當然，你也可以根據自己的需求，將上述樣式應用于其他元素，如導航欄、列表等。

以上就是關于CSS豎虛線效果的介紹，希望可以對大家有所幫助。