vue2中使用深度修改样式deep

作者: hsqin | 来源:发表于2021-07-11 17:34 被阅读0次

之前在vue3中的scss里使用deep，直接 deep(.classname)就可以了

//vue3中的使用方式
.detail-chk-group {
     &:deep(.van-cell-group) {
          margin-bottom: pxToRem2(20);
     }
}

可是在vue2中，这样使用根本没识别，经过测试发现，最终使用方法如下：

<style scoped>
    /* vue2中的deep的使用 */
    .j_chin_step_refuse >>> .el-step__title.is-process {
      color: #BDBDBD!important;
    }
</style>

注意：
1，不能使用less/scss等，只能使用原生css方式
2，最好写在scoped中，只在本页面生效

vue2中使用深度修改样式deep
之前在vue3中的scss里使用deep，直接 deep(.classname)就可以了可是在vue2中，这样使...
elementui 单独修改一个label的样式
样式修改不要全局，使用/deep/穿透
改变组件中的样式-deep
修改组件中的样式使用/deep/不生效时将deep提到全局变量中即可common.less index.vue
angular修改子组件样式
angular在父组件修改子组件样式使用 :host ::ng-deep .className{ } 常在修改第三...
2018-07-18 Vue scoped CSS 与深度作用选
使用 scoped 后，父组件的样式将不会渗透到子组件中，如果失效的话：使用深度作用选择器/deep/ /dee...
Angular组件样式无法覆盖全局样式或者其他引用样式
使用:host ::ng-deep 可以修改全局样式和其他引用的控件库ui样式进行覆盖官方参考地址原样式在我们自...
vue 使用 /deep/ 修改样式
vue组件中，在style设置为scoped时，里面写的样式对子组件是不生效的，此时可以使用 /deep/ 深度选...
2018-09-06
修改vue项目中组件中引入的子组件或第三方插件或库的样式方法一：使用/deep/ 方法二：使用 >>> 方法三：...
vue项目使用/deep/语法报错并且无法启动项目最佳最完美解决
vue项目使用/deep/语法报错最近使用vue创建后台管理系统，在改变饿了么组件样式时，使用/deep/样式穿透...
lementui
修改lement组件的深层样式，类名前加 /deep/