在Element UI中,el-tree 组件的选中节点背景色通常是通过其内部样式表控制的。为了修改这个背景色,你需要通过编写自定义CSS来覆盖默认样式。以下是一步一步的指南: 1. 查找el-tree组件的选中节点样式 Element UI中,el-tree 的选中节点通常会有一个类名如 .is-current 或.el-tree-node__content--is-current(...
//将原来的颜色置为无 const content = element.querySelectorAll('.el-tree-node__content'); content[0].style.background ="none"; // 加类,变更 if(element.className.indexOf('s-bg2') === -1){ element.className +=" s-bg2 s-c"; } } } }) },...
background: #00eaff;//修改选中时checkbox背景颜色 &::after { border-color: #002237;//修改checkbox对钩颜色 } } .el-tree-node__expand-icon { color: #0095A8;//修改el-tree树结构自带的三角图标的颜色 } .el-tree-node__expand-icon.is-leaf::before { display: none;//修改el-tree树结构自带...
vue elementUI 覆盖el-tree的样式,选中的背景颜色修改,.el-tree-node.is-current>.el-tree-node__content{background-color:#2F8DFB!important;color:white;}.el-checkbox__input.is-checked+.el-checkbox__label{col...
['tree'].setCurrentKey(this.currentKey)})}this.loading=false}).catch(e=>{this.loading=false})},// 筛选节点filterNode(value,data){if(!value)returntruereturndata.desc.indexOf(value)!==-1}}}.region-tree{position:relative;height:calc(100vh - 145px);width:270px;padding-top:50px; &-...
修改tree点击时及失焦时的背景颜色 原生: image.png 修改后: image.png <!-- highlight-current 要添加高亮属性 --><el-treeref="treeForm"current-node-keynode-key="depart_id":data="list":props="defaultProps"@node-click="handleNodeClick"></el-tree>/* 改变被点击节点背景颜色,字体颜色 */ ...
el-tree-node__content { height: 36px; } /* 节点前边的三角图标并不会被节点样式影响,需要单独修改 当前激活的颜色*/ .el-tree-node:focus > .el-tree-node__content .el-tree-node__expand-icon { color: #fff; } /* 改变被点击节点背景颜色,字体颜色 */ .el-tree-node:focus > .el-tree-...
如果默认有选中值,那么这个必不可少
51CTO博客已为您找到关于vue el-tree样式的相关内容,包含IT学习相关文档代码介绍、相关教程视频课程,以及vue el-tree样式问答内容。更多vue el-tree样式相关解答可以来51CTO博客参与分享和学习,帮助广大IT技术人实现成长和进步。
/*.filter-tree .el-tree-node.is-current { background-color: rgb(54 9 9) !important; }*/.filter-tree .el-tree-node:focus > .el-tree-node__content { background-color: #ccc !important; } 不知道为什么上面那种方法不行,网上看到的下面的,可以的,就是style要是全局的,所以在el-tree加了个...