给标签项设置左右padding的时候,发现tab选项卡的下边线宽度很长,通过查看元素的结构发现下边线是通过.ivu-tabs-ink-bar元素决定的,想要实现与文字大小一样宽的下边线效果,通过设置下边线的宽度和margin-left来设置
原效果
想要实现的效果
tabs组件结构
css样式
//tab选项卡样式
/deep/ .ivu-tabs-nav {
.ivu-tabs-tab {
font-size: 16px;
padding: 18px 40px 18px 35px;
}
}
//下划线样式
/deep/.ivu-tabs-ink-bar {
margin-left: 35px;
width: 64px !important;
}