豎線分割線CSS在網頁設計中經常會用到，它可以讓頁面更加美觀、易讀。豎線分割線CSS使用簡單，只需要 添加一些CSS代碼即可。

.separator{
display: flex;
margin-bottom: 20px;
align-items: center;
width: 100%;
}
.separator::before, .separator::after{
content: "";
flex: 1;
border-bottom: 1px solid #e6e6e6;
}
.separator::before{margin-right: .25em;}
.separator::after{margin-left: .25em;}

上面的CSS代碼為豎線分割線CSS的基礎代碼，可以在需要插入豎線分割線的位置使用該CSS。

下面是一個例子：

左側內容

以上代碼會產生一個左側內容并帶有豎線分割線的效果。

你也可以通過CSS修改豎線分割線的顏色、粗細、長度等屬性。例如，修改豎線分割線為1像素粗細的紅色，則代碼為：

.separator::before, .separator::after{
content: "";
flex: 1;
border-left: 1px solid red;
}
.separator::before{margin-right: .25em;}
.separator::after{margin-left: .25em;}

最后，需要注意的是，在使用豎線分割線CSS之前，確保你的HTML代碼是正確嵌套的，否則可能造成不良影響。