CSS中讓豎線居中有多種方法，下面我們分別介紹幾種常見的方法：

1. 使用line-height屬性

.line{
border-left: 2px solid #000;
height: 20px;
line-height: 20px;
text-align: center;
}

利用line-height屬性讓豎線與文字垂直居中，text-align屬性讓豎線水平居中。

2. 使用偽元素:before

.line{
position: relative;
height: 20px;
text-align: center;
}
.line:before{
content: "";
position: absolute;
top: 50%;
left: 0;
margin-top: -1px; /* 豎線高度的一半 */
border-left: 2px solid #000;
height: 50%;
}

使用絕對定位將豎線放在父元素中心，利用margin-top屬性將豎線垂直居中。

3. 使用flex布局

.container{
display: flex;
align-items: center;
justify-content: center;
}
.line{
border-left: 2px solid #000;
height: 20px;
}

使用flex布局讓豎線在容器中水平垂直居中。