elementui el-input修改字体样式

elementui el-input修改样式

需求,要求配送备注红色字体显示

在这里插入图片描述

解决方案

1.使用id定位到一个el-input 元素

2.为此id指定样式

代码

html 复制代码
<!--代码-->
<el-form-item prop="dispatchRemark" label="派单备注" :label-width="formLabelWidth" inline style="width: 85%; color: red">
  <el-input v-model="form.dispatchRemark" id="dispatchRemark" disabled autocomplete="off" style="color:red;"></el-input>
</el-form-item>

<!--样式-->
<style scoped>
/deep/ #dispatchRemark{
  color: red;
}
</style>

注意:必须使用/deep/否则无效,而且/deep/ 后面不能接其他选择器,否则还是无效

相关推荐
Embrace92411 小时前
React Native + Realm 离线方案处理
javascript·react native·react.js·realm
chenyingjian11 小时前
鸿蒙|能力特性-统一文件预览
前端·harmonyos
毛骗导演11 小时前
OpenClaw 沙箱执行系统深度解析:一条 exec 命令背后的安全长城
前端·架构
天才聪11 小时前
鸿蒙开发vs前端开发1-父子组件传值
前端
卡尔特斯11 小时前
Android Studio 代理配置指南
android·前端·android studio
李剑一11 小时前
同样做缩略图,为什么别人又快又稳?踩过无数坑后,我总结出前端缩略图实战指南
前端·vue.js
Jolyne_12 小时前
Taro样式重构记录
前端
恋猫de小郭12 小时前
Google 开源大模型 Gemma4 怎么选,本地跑的话需要什么条件?
前端·人工智能·ai编程
文心快码BaiduComate12 小时前
Comate搭载GLM-5.1:长程8H,对齐Opus 4.6
前端·后端·架构
熊猫钓鱼>_>12 小时前
AI驱动的Web应用智能化:WebMCP、WebSkills与WebAgent的融合实践
前端·人工智能·ai·skill·webagent·webmcp·webskills