开发中修改第三方组件样式很常见,但是由于scoped属性的样式隔离,可能需要去掉scoped或者另起一个样式。这些做法有副作用(组件样式污染,缺乏优雅),在css预处理器中使用样式渗透来生效。
我们可以使用 >>> 或者 /deep/ 来解决这个问题:
vue2 的sass深度选择器
vue2的css深度选择器
原生css:
>>> .el-card__headerSass/Scss:
::v-deep .el-card__headerLess:
/deep/ .el-card__headervue3的css深度选择器
Sass/Scss/Less原生css都可以使用:
:deep() { /* styles */ }或::deep() { /* styles */ }