1.场景:当对第三方,比如element ui中的el-input样式不满意时,及需要修改样式时
<el-input placeholder="请点击放大镜" v-model="aaa" size="mini"> </el-input>
官方默认样式时白色的,我们期望是红色
2.在浏览器中用f12找到该el-input在组件中的样式层级,如:
.el-form .el-input .el-input__inner {}
3.给我们需要改的样式街上私有父级,如:
<div class="input-pro"> <el-input placeholder="请点击放大镜" v-model="aaa" size="mini"> </el-input> </div>
4.将样式加载最里侧的类选择器上,如:
.input-pro .el-input /deep/ .el-input__inner { background-color: red; }
这样就是先局部修改第三方组件样式了