Vue+ElementUI 修改el-form表单中某一项的样式

Vue+ElementUI 修改el-form表单中某一项的样式

效果：

实现：

在el-form-item外面套一个div，定义一个class，在里面做样式穿透

<el-col :span='8'>
    <div class="redClass"> 
        <el-form-item label="有效日期" prop="defaultTime">
            <el-date-picker
                    style="color:red; font-weight:700;"
                    :disabled = 'timeTag'
                    v-model="customerForm.validDate"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    clearable
                    type="date"
                    range-separator="-"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
            </el-date-picker>
        </el-form-item>
    </div>
</el-col>

<style scoped>
    .redClass /deep/ .el-input__inner{
        color:red ;
        font-weight: 700;
    }
    .redClass /deep/ .el-form-item__label{
        color:red !important;
        font-weight: 700;
    }
</style>