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;

相关推荐
兆子龙4 分钟前
从高阶函数到 Hooks:React 如何减轻开发者的心智负担(含 Demo + ahooks 推荐)
前端
狗胜9 分钟前
测试文章 - API抓取
前端
三小河9 分钟前
VS Code 集成 claude-code 教程:告别海外限制,无缝对接国内大模型
前端·程序员
jerrywus14 分钟前
前端老哥的救命稻草:用 Obsidian 搞定 Claude Code 的「金鱼记忆」
前端·agent·claude
球球pick小樱花19 分钟前
游戏官网前端工具库:海内外案例解析
前端·javascript·css
前端Hardy26 分钟前
干掉 Virtual DOM?尤雨溪开始"强推" Vapor Mode?
vue.js·vue-router
用户605723748730827 分钟前
AI 编码助手的规范驱动开发 - OpenSpec 初探
前端·后端·程序员
狗胜30 分钟前
AI观察日记 2026-03-02|CLAUDE、TYPE、APPFUNCTIONS:掘金热门里的下一步信号
前端
喝水的长颈鹿31 分钟前
【大白话前端 02】网页从解析到绘制的全流程
前端·javascript
明君8799733 分钟前
Flutter 实现 AI 聊天页面 —— 记一次 Markdown 数学公式显示的踩坑之旅
前端·flutter