更改elementui的箭头图片以及位置

javascript 复制代码
//更改箭头位置
.el-tree-node__content > .el-tree-node__expand-icon {
  position: absolute;
  right: 12px;
}
javascript 复制代码
//更改箭头图片
.el-tree-node__expand-icon {
  transform: rotate(-90deg);
}
.el-tree-node__expand-icon.expanded {
  transform: rotate(0deg);
}
// 有子节点 且已展开
.el-tree .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
  background: url('~@/assets/images/arrow.png') no-repeat 0 3px;
  content: '';
  display: block;
  width: 12px;
  height: 12px;
  font-size: 12px;
  background-size: 12px;
}
// 有子节点 且未展开
.el-tree .el-icon-caret-right:before {
  background: url('~@/assets/images/arrow.png') no-repeat 0 3px;
  content: '';
  display: block;
  width: 12px;
  height: 12px;
  font-size: 12px;
  background-size: 12px;
}
// 没有子节点
.el-tree .el-tree-node__expand-icon.is-leaf::before {
  background: #fff;
  content: '';
  display: block;
  width: 0px;
  height: 0px;
  font-size: 0px;
  background-size: 0px;
}
相关推荐
鸡吃丸子2 分钟前
浏览器是如何运作的?深入解析从输入URL到页面渲染的完整过程
前端
作业逆流成河5 分钟前
🔥 enum-plus 3.0:介绍一个天花板级的前端枚举库
前端·javascript·前端框架
爱喝水的小周10 分钟前
《UniApp 页面导航跳转全解笔记》
前端·uni-app
蒜香拿铁18 分钟前
Angular【组件】
前端·javascript·angular.js
ByteCraze18 分钟前
一文讲透 npm 包版本管理规范
前端·arcgis·npm
梵得儿SHI33 分钟前
Vue 模板语法深度解析:从文本插值到 HTML 渲染的核心逻辑
前端·vue.js·html·模板语法·文本插值·v-text指令·v-html指令
Sapphire~38 分钟前
重学JS-012 --- JavaScript算法与数据结构(十二)正则表达式
javascript·数据结构·算法
浪裡遊39 分钟前
HTML面试题
前端·javascript·react.js·前端框架·html·ecmascript
More more1 小时前
uniapp实时查看在线监控,JessibucaMobile实现横屏播放
前端·javascript·uni-app·jessibucamobile
i小杨1 小时前
React 状态管理库相关收录
前端·react.js·前端框架