更改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;
  }

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

相关推荐
Bald Monkey1 小时前
【Element Plus】解决移动设备使用 el-menu 和 el-sub-menu 时,子菜单需要点击两次才会隐藏的问题
前端·elementui·vue·element plus
三原1 小时前
2025 乾坤(qiankun)和 Vue3 最佳实践(提供模版)
vue.js·架构·前端框架
DC...2 小时前
vue滑块组件设计与实现
前端·javascript·vue.js
H5开发新纪元2 小时前
Vite 项目打包分析完整指南:从配置到优化
前端·vue.js
吃面必吃蒜3 小时前
从 Vue 到 React:React 合成事件
javascript·vue.js·react.js
前端练习生3 小时前
vue2如何二次封装表单控件如input, select等
前端·javascript·vue.js
不爱说话郭德纲4 小时前
Vue scoped都用过吧,它是怎么实现样式隔离的?React又是怎么实现的
前端·javascript·vue.js
OpenTiny社区4 小时前
直播预告|TinyVue 组件库高级用法:定制你的企业级UI体系
前端·vue.js·开源
Cyann5 小时前
vue3实战项目第一日(学习项目):封装svg全局组件
vue.js
2501_915373885 小时前
vue之事件绑定
前端·javascript·vue.js