更改el-select-dropdown_item selected选中颜色

更改el-select-dropdown_item selected选中颜色

默认为element主题色

在修改element select下拉框选中颜色时会发现不生效,原因是:el-select下拉框插入到了body中

解决办法:

在select标签里填写:popper-append-to-body="false"属性,禁止select下拉框插入到body中

html 复制代码
<el-select 
  v-model="value" 
  @change="changeProjectStatus" 
  placeholder="请选择" 
  :popper-append-to-body="false">
   <el-option
      v-for="item in tabOptions"
      :key="item.status"
      :label="item.label"
      :value="item.status">
    </el-option>
</el-select>

然后更改选中元素的颜色,就可以了

css 复制代码
::v-deep .el-select-dropdown__list .selected{
    color: #2e49ad;
  }

但是,我在另一个组件中写了却不起作用(像是被下面的元素遮挡了),最后写在了全局样式里,才显现出来,不知道什么原因?

相关推荐
像我这样帅的人丶你还8 小时前
别再让JS耽误你进步了。
css·vue.js
@yanyu6669 小时前
07-引入element布局及spring boot完善后端
javascript·vue.js·spring boot
王霸天9 小时前
💥别再抄网上的Scale缩放代码了!50行源码教你写一个永不翻车的大屏适配
前端·vue.js·数据可视化
悟空瞎说9 小时前
深入 Vue3 响应式:为什么有的要加.value,有的不用?从设计到源码彻底讲透
前端·vue.js
SuperEugene11 小时前
前端通用基础组件设计:按钮/输入框/弹窗,统一设计标准|组件化设计基础篇
前端·javascript·vue.js·架构
我命由我1234511 小时前
在 React 项目中,可以执行 npm start 命令,但是,无法执行 npm build 命令
前端·javascript·vue.js·react.js·前端框架·json·ecmascript
aidou131412 小时前
Vue3自定义实现日期选择器(可单选或多选)
前端·javascript·vue.js·日期选择器·transition
忆琳13 小时前
Vue3 优雅解决单引号注入问题:自定义指令 + 全局插件双方案
vue.js·element
Ruihong13 小时前
放弃 Vue3 传统 <script>!我的 VuReact 编译器做了一次清醒取舍
前端·vue.js
蜡台14 小时前
IDEA LiveTemplates Vue ElementUI
前端·vue.js·elementui·idea·livetemplates