默认情况下，el-tabs下划线长度根据标签内容自动调整。那么如何自定义e-tabs的样式呢？
1.el-tabs标签设置自定义class名
<el-tabs v-model="" class='custom-tabs'>
<el-tab-pane v-for="(item, index) in list" :key="index" :label="item.value"></el-tab-pane>
</el-tabs>2.css样式中这样写:
// 此处是把tabs的边距清空
::v-deep .el-tabs__item {
padding: 0;
}
.custom-tabs ::v-deep .el-tabs__active-bar {
width: 21px!important; // 假如设置下划线固定21px
margin-left: calc((100% / 3 - 21px) / 2); // 3为tabs的数量
background-color: red;
height: 4px;
border-radius: 4px;
}3.效果图
