vue如何修改el-form-item中的label样式修改问题

更新时间：2023年10月17日 09:11:10 作者：__十七

这篇文章主要介绍了vue如何修改el-form-item中的label样式修改问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

修改el-form-item中的label样式修改

操作步骤

1，style标签中不要加scoped

2，在对应的el-form-item的label标签属性中加入class属性

3，在style标签中，先找到label对应的class，在修改label

<el-form-item label="用户名" class="item">
        <el-input v-model="ruleForm.username" placeholder="请输入用户名" maxlength="10"></el-input>
   </el-form-item>

<style lang="less">
      .item .el-form-item__label{
    color: blake;
}
   </style>

vue使用elementUI form表单label样式修改

1.删除style标签中的 scoped 属性

   <style lang="lang" scoped>
      ...
   </style>

2.在对应el-form-item的label属性中加入class样式

   <el-form-item label="用户名" class="item">
        <el-input v-model="ruleForm.username" placeholder="请输入用户名" maxlength="10"></el-input>
   </el-form-item>

3.审查元素，找到label对应的class

如：.el-form-item__label 添加如下样式代码

.item .el-form-item__label{
    color: wheat;
}

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

Pinia实现数据持久化存储实践
安装pinia-plugin-persist插件,引入并挂载后启用数据缓存（默认存入sessionStorage）,可通过paths自定义持久化字段,未指定的state将不进行缓存
2025-07-07
vue 右键菜单插件简单、可扩展、样式自定义的右键菜单
这篇文章主要介绍了vue 右键菜单插件简单、可扩展、样式自定义的右键菜单，本文给大家分享个例子，给大家及时的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下
2018-11-11
Vue设置页面轮询实现方式
这篇文章主要介绍了Vue设置页面轮询实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
2025-11-11
Vue3之事件绑定的实现逻辑详解
这篇文章主要介绍了Vue3之事件绑定的实现逻辑,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
2023-11-11
关于导入、配置Vuetify遇到的几个问题
这篇文章主要介绍了关于导入、配置Vuetify遇到的几个问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2023-06-06
vue全局引入scss(mixin)
本文主要介绍了 vue全局引入scss,我们在写VUE的时候,会使用scss，也会做一些通用样式,方便使用,在写好的通用样式的时候,每次都要单文件导入,刚开始写的时候,感觉还好,后面工程量大了后,就显得麻烦,那么本文就全局导入scss样式,下面来看详细内容,需要的朋友可以参考一下
2021-11-11
vue 实现element-ui中的加载中状态
这篇文章主要介绍了vue 实现element-ui中的加载中状态，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2020-11-11
vue实现el-table点选和鼠标框选功能的方法
在Vue中我们经常需要处理表格数据,这篇文章主要给大家介绍了关于vue实现el-table点选和鼠标框选功能的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
2023-10-10
vue实现验证码倒计时按钮
这篇文章主要为大家详细介绍了vue实现验证码倒计时按钮，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-08-08
vue多页面开发和打包正确处理方法
这篇文章主要介绍了vue多页面开发和打包的正确处理方法，非常不错，具有参考借鉴价值,需要的朋友可以参考下
2018-04-04