Vue2、Vue3中 CSS 穿透（深度选择器）
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Vue2、Vue3中 CSS 穿透（深度选择器）相关的知识，希望对你有一定的参考价值。
参考技术A // 插槽选择器:slotted()
// 全局选择器
:global()
深度选择器
参考技术A 我们使用scoped实现组件的私有化，不对全局造成样式污染，表示当前style属性只属于当前模块.但我们难免会用到一些框架如element vant等,我们想要修改其中样式时,如果使用了scoped,则需要深度选择器来进行样式的更改.使用场景:
当我们需要覆盖element-ui中的样式时只能通过深度作用选择器
style为css时的写法如下
有些像 Sass 之类的预处理器无法正确解析 >>>。这种情况下你可以使用 /deep/ 或 ::v-deep 操作符取而代之——两者都是 >>> 的别名，同样可以正常工作。
style使用css的预处理器(less, sass, scss)的写法如下
第一种/deep/
第二种::v-deep
建议使用第二种方式,/deep/在某些时候会报错,::v-deep更保险并且编译速度更快.
以上是关于Vue2、Vue3中 CSS 穿透（深度选择器）的主要内容，如果未能解决你的问题，请参考以下文章
[干货]关于vue3 SFC 范围内 scoped-styles 样式穿透