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/ 后面不能接其他选择器,否则还是无效

相关推荐
GISer_Jing19 小时前
明天好好总结汇总分析博客
前端·javascript·面试
做运维的阿瑞1 天前
Windows 环境下安装 Node.js 和 Vue.js 框架完全指南
前端·javascript·vue.js·windows·node.js
Dontla1 天前
Tailwind CSS介绍(现代CSS框架,与传统CSS框架Bootstrap对比)Tailwind介绍
前端·css·bootstrap
yinuo1 天前
uniapp微信小程序安卓手机Touchend事件无法触发
前端
你的人类朋友1 天前
【Node】Node.js 多进程与多线程:Cluster 与 Worker Threads 入门
前端·后端·node.js
闲人编程1 天前
使用Celery处理Python Web应用中的异步任务
开发语言·前端·python·web·异步·celery
excel1 天前
前端读取文件夹并通过 SSH 上传:完整实现方案 ✅
前端
谢尔登1 天前
【Nest】日志记录
javascript·中间件·node.js
双向331 天前
【征文计划】基于Rokid CXR-M SDK 打造AI 实时会议助手:从连接到自定义界面的完整实践
前端
Lei活在当下1 天前
【业务场景架构实战】6. 从业务痛点到通用能力:Android 优先级分页加载器设计
前端·后端·架构