elementui竖分割线

Element UI提供了多种方法来创建竖向分割线。一种方法是在正确的位置加上`<el-divider direction="vertical"></el-divider>`。但是这种方法会创建一个迷你版的分割线，可能无法满足分割的目的。

另一种方法是使用自定义样式来创建竖向分割线。你可以在样式中添加以下代码:

.el-divider--vertical {
display: inline-block;
width: 1px;
height: 70%;
margin: 0 8px;
background: 0 0;
border-left: 2px dashed #e8eaec;
position: relative;
}

还可以在当前页面的style标签中添加以下样式代码:

.el-divider--vertical{
display:inline-block;
width:1px;
height:100%;
margin:0 8px;
vertical-align:middle;
position:relative;
}

以上的方法可以让你根据需要创建不同样式的竖向分割线。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *3* [【elementUI】更改侧边导航栏右侧竖向分割线的长度](https://blog.csdn.net/weixin_44774630/article/details/107851519)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *2* [ElementUI 设置分割线样式](https://blog.csdn.net/hzr0523/article/details/119546791)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]