样式穿透 解决ui框架组件修改样式
2020-12-11 本文已影响0人
闲人追风落水
vue中使用这中样式写法的时候
<style lang="scss" scoped> .... </style>
当使用ui框架的时候,框架的组件在使用中,属于你当前所写页面的子组件
<style lang="scss" scoped> .... </style> 中编写的话只会影响当前组件内的样式
1.如果你希望 scoped 样式中的一个选择器能够作用得“更深”,例如影响子组件,你可以使用 >>> 操作符
<style lang="css" scoped>
.a >>> .b {
/* ... */
}
</style>
2./deep/
<style lang="scss" scoped>
.a{
/deep/ .b {
/* ... */
}
}
</style>
3.::v-deep
::v-deep .a{
***
}
建议使用 ::v-deep标准模式