ant-design中取消tab激活时候的下划线

ant-design中取消tab激活时候的下划线,第1张

git上看到的这个取消

写在当前vue文件样式中不添加scoped属性才会生效。最好还是新建一个global.less中修改组件默认样式,然后在main.js中引入一下。一般在要修改的组件上添加个类名比如user,这样只修改当前组件。 当前文件

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
    }
}

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1323086.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-12
下一篇 2022-06-12

发表评论

登录后才能评论

评论列表(0条)

保存