改变 element的el-tabs默认选中项颜色

这篇文章介绍了如何改变ElementUI的el-tabs组件默认选中项的文字颜色和背景颜色。通过添加CSS样式,可以在App.vue全局设置中实现选中项文字变为红色,背景变为#c81623。同时,鼠标悬停时文字颜色也会变化。需要注意的是,这些样式更改必须在App.vue中进行,否则不会生效。
摘要由CSDN通过智能技术生成
  • 改变 element的el-tabs默认选中项 文字颜色

.el-tabs__item {
  color: #000 !important;
}
.el-tabs__item.is-active {
  color: red !important;
}
  • 改变 element的el-tabs默认选中项 背景颜色问题

 .el-tabs__item:hover {
  color: #000;
}
.el-tabs__item.is-active {
  color: #fff;
  background-color: #c81623;
} 

注意点:一定要在App.vue里设置才生效,在当前页面.vue里设置不生效!

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值