Vue样式穿透

样式穿透

用处：

1. vue常用的组件库，有scope的css样式都会另外加上其他的字符串，造成样式隔离；

2. 将父组件的样式将渗透到子组件中；

解决办法：

1. >>> 只作用于css；
2. ::v-deep 只作用于sass；
3. /deep/ 只作用于less；
4. 去掉scoped；

<style lang="scss" scoped>
.conBox ::v-deep .el-input__inner{
    padding:0 10px;
}
</style>

<style lang="less" scoped>
.conBox /deep/ .el-input__inner{
    padding:0 10px;
}
</style>

<style>
.num-input {
    width: 90px;
    margin-top: 15px;
    >>> .ivu-input {
      text-align: center!important;
    }
}
</style>