修改el-form-item中的label里面的字体边距或者大小问题
作者：Luffy船长
这篇文章主要介绍了修改el-form-item中的label里面的字体边距或者大小问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
修改el-form-item中的label里面的字体边距或大小
问题描述
在form表单中，有的时候需要设置必填项之类的，可能会加个星(*)这样的话字体的两边的宽度就会对不齐，影响美观，可以看到这里的三个输入框就没对齐
解决方案：
解决方案其实很简单，只需要在from表单那就加上两个属性即可
码代码如下：
<el-col :span="6"> <el-form-item label="病种编码" prop="diseCodg" label-width="90px" style="margin-left: 10px;"> <el-select v-model="queryInfos.diseCodg" style="width:100%" size="small" filterable clearable placeholder="请选择" @change="Functioner" @change.native="selectBlurLogic" @blur.native="selectBlurLogic"> <el-option v-for="(opt,j) in letters" :key="j" :label="opt.diseCodg" :value="opt.diseCodg"> </el-option> </el-select> </el-form-item> </el-col>
将el-form-item 的label 的字体颜色修改为不同的颜色
用element的官方例子举例
比如要在活动名称后面加个括号(必填) 这种，颜色要写成红色， 但是 活动名称 是写在label中的
<el-form-item label="活动名称">
<el-input v-model="form.name"></el-input>
</el-form-item>
改成下面这样的
代码如下
<el-form-item >
<span slot="label">
<span>活动名称</span>
<span style="color: red">（必填）</span>
</span>
<el-input v-model="form.name" style="width: 70%"></el-input>
</el-form-item>
去掉el-form-item label 属性
改成 然后后面再用span 写上你要添加的内容 颜色就可以自定义了
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。