ant-design中取消tab激活时候的下划线
- 写在当前vue文件样式中不添加scoped属性才会生效。
- 最好还是新建一个global.less中修改组件默认样式,然后在main.js中引入一下。一般在要修改的组件上添加个类名比如user,这样只修改当前组件。
- 在当前文件夹
<style>
.ant-tabs-ink-bar {
visibility: hidden;
}
</style>
- 全局的样式文件** global.less**
// 添加个类名 隐藏掉激活时候下划线
.user{
.ant-tabs-ink-bar {
visibility: hidden;
}
}
修改后:
- 其它:
给激活的tab标签添加其它样式
.user{
.ant-tabs-ink-bar {
visibility: hidden;
}
.ant-tabs-nav .ant-tabs-tab-active {
background-color: @primary-color;
color: #fff;
border-radius: 20px;
text-shadow: 0 0 10px currentColor
}
}