Element-plus 【el-input输入框】和【el-select下拉选择框】样式修改

el-input & el-select

参考链接:

【1】【浏览器】f12控制台,如何选中click、hover才出现的元素(断点调试)_f12跟踪click-CSDN博客

【2】

Element-plus的el-input改边框focus后颜色_element input框 出发焦点改变边框颜色-CSDN博客

【3】

【Element-plus】修改el-input、el-select的样式(代码+教程)_elementplus中select和tree中的ishovering的样式-CSDN博客

首先根据参考链接1的方法,通过打断点,可以找到el-select选中元素的样式是由:

css 复制代码
el-select-dropdown__item.is-selected

控制的,

因此在代码中这样修改:[这样修改所有的下拉框的选中选项颜色都会变成红色]

css 复制代码
<style lang="scss" scoped>
.el-select-dropdown__item.is-selected{
    color:red !important;
    font-weight:bold;
}
</style>

el-input样式的修改可以参考链接2;

相关推荐
周周记笔记9 分钟前
初识HTML和CSS(一)
前端·css·html
aq553560011 分钟前
网页开发四剑客:HTML/CSS/JS/PHP全解析
javascript·css·html
程序员buddha18 分钟前
TypeScript详细教程
javascript·ubuntu·typescript
chxii44 分钟前
在 IIS 中实现 SSL 证书的自动续期
前端
周星星日记1 小时前
vue3中静态提升和patchflag实现
前端·vue.js·面试
橘子编程1 小时前
React 19 全栈开发实战指南
前端·react.js·前端框架
DanCheOo1 小时前
AI Streaming 架构:从浏览器到服务端的全链路流式设计
前端·agent
我是小趴菜1 小时前
前端如何让图片、视频、pdf等文件在浏览器直接下载而非预览
前端
cg331 小时前
开源项目自动化:用 GitHub Actions 让每个 Issue 都被温柔以待
前端
haierccc1 小时前
Win7、2008R2、Win10、Win11使用FLASH的方法
前端·javascript·html