el-tree设置选中高亮焦点高亮、选中的节点加深背景,更改字体颜色等

在这里插入图片描述
el-tree默认的focus样式颜色太浅,有时候电脑亮度低或者换个有色差的屏幕,根本看不出来哪一个节点被选中了。而且只有焦点在el-tree时才有颜色变化,鼠标在别的地方点一下就没了,这样会让用户忘记自己之前选的是哪个节点,很不方便。


第一步:给el-tree组件标签加上属性highlight-current开启高亮

在这里插入图片描述
加了这个属性,选中的节点的样式才会有highlight-current类,这样接下来才能改变选中的节点的样式。


第二步:在css中修改高亮样式

一个小tip:这里建议是给该页面文件最外层的div加个专有的类,比如我这个页面是“组织配置”,标签就加个class=“organization_configuration”,然后style里的样式全部写在.organization_configuration{}中,这样就不用加scoped了,也更符合vue组件化的开发思路

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值