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

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

相关推荐
一只蝉nahc2 小时前
vue使用iframe内嵌unity模型,并且向模型传递信息,接受信息
前端·vue.js·unity
MXN_小南学前端4 小时前
前端开发中 try...catch 到底怎么用?使用场景和最佳实践
javascript·vue.js
Z_Wonderful5 小时前
基于 Vite 的 React+Vue 混部完整模板(含目录结构、依赖清单、启动脚本)
前端·vue.js·react.js
束尘6 小时前
Vue3 项目集成 OnlyOffice 在线编辑 + 自定义插件开发(二):插入功能全实现
数据库·vue.js·mysql
誰在花里胡哨7 小时前
Vue<前端页面装修组件>
前端·vue.js
前端那点事7 小时前
Vue组件通信全场景详解(Vue2+Vue3适配)| 实战必备,新手也能看懂
vue.js
梦想CAD控件7 小时前
在线CAD开发包图纸转换功能使用指南
前端·javascript·vue.js
费曼学习法7 小时前
虚拟 DOM 的 Diff 算法:Vue/React 如何实现高效更新
javascript·vue.js
前端那点事8 小时前
前端必看!console 调试不只有 log,这 8 个技巧省一半调试时间
vue.js
OpenTiny社区8 小时前
多端开发头疼?TinyVue 3.30 一招搞定,AI还帮你写代码!
前端·vue.js·github