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

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

相关推荐
接着奏乐接着舞2 小时前
sse 两种调用方式
前端·javascript·vue.js
azhou的代码园16 小时前
基于SpringBoot+Vue的家教小程序
vue.js·spring boot·小程序·毕业设计·家教小程序
anyup17 小时前
全面重构的 uni-app 多平台上传组件,功能强到离谱!
前端·vue.js·uni-app
WebGirl19 小时前
【Vue3】withDefaults和defineProps设置默认值
vue.js
FlyWIHTSKY19 小时前
Element Plus 中 el-row 和 el-col 的完整使用指南**
javascript·vue.js·ecmascript
azhou的代码园19 小时前
基于微信小程序的图片识别科普系统的设计与实现
vue.js·spring boot·微信小程序·小程序·毕业设计·科普·图片识别
三维搬砖者21 小时前
挑战AI辅助从零构建3D模型编辑器:01基于Vue3 + Three.js的现代化架构设计
前端·vue.js·github
LIO1 天前
一套代码,多端并行——uni-app + Vue3 多端开发完全指南
前端·vue.js·uni-app
前端那点事1 天前
干掉重复请求!Vue+Axios全局防抖节流封装,企业级开箱即用
前端·vue.js
前端那点事1 天前
Vue三点运算符(...)超全详解!9大数组+4大对象实战用法,零基础必懂
前端·vue.js