深度选择器(>>>或者::v-deep)

使用场景:

当你子组件使用了 scoped 但在父组件又想修改子组件的样式可以 通过 >>> 来实现:

<style scoped>
  .a >>> .b { /* ... */ }
</style>

将会编译成

.a[data-v-f3f3eg9] .b {
/* ... */
}

如果你使用了一些预处理的东西,如 sass 你可以通过 ::v-deep 来代替 >>> 实现想要的效果。

所以你想覆盖某个特定页面 element 的 el-tag 的样式,你可以这样做:

.drag-select {
::v-deep {
.sortable-ghost {
opacity: .8;
color: #fff !important;
background: #42b983 !important;
}

.el-tag {
cursor: pointer;
}
}
}
如果觉得文章有帮助到你,可以扫描以下二维码
   请本文作者 喝一杯
pay_weixin pay_weixin

发表评论

电子邮件地址不会被公开。 必填项已用*标注