vue之deep-第三方样式穿透

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;
}

这样就是先局部修改第三方组件样式了