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

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

相关推荐
一 乐4 小时前
点餐|智能点餐系统|基于java+ Springboot的动端的点餐系统小程序(源码+数据库+文档)
java·前端·数据库·vue.js·spring boot·小程序·论文
久爱@勿忘7 小时前
vue下载项目内静态文件
前端·javascript·vue.js
摇滚侠9 小时前
Vue 项目实战《尚医通》,医院详情菜单与子路由,笔记17
前端·vue.js·笔记
有来技术10 小时前
vite-plugin-vue-mcp:在 Vue 3 + Vite 中启用 MCP,让 AI 理解并调试你的应用
前端·vue.js·人工智能
鹏北海10 小时前
Vue 3 超强二维码识别:多区域/多尺度扫描 + 高级图像处理
前端·javascript·vue.js
网络点点滴11 小时前
watch监视-ref基本类型数据
前端·javascript·vue.js
西洼工作室11 小时前
前端接口安全与性能优化实战
前端·vue.js·安全·axios
Crystal32813 小时前
App端用户每日弹出签到弹窗如何实现?(uniapp+Vue)
前端·vue.js
molly cheung13 小时前
Vue3:watch与watchEffect的异同
vue.js·watch·store·watcheffect
掘金安东尼15 小时前
前端周刊第439期(2025年11月3日–11月9日)
前端·javascript·vue.js