不同预处理器less、scss等下如何写样式穿透

为什么会需要样式穿透？

在Vue项目中，当我们引入第三方组件库时(如使用element-ui)，需要在局部组件中修改第三方组件库样式，而又不想去除scoped属性造成组件之间的样式覆盖。这时候我们就需要样式穿透来实现我们想要的效果。

为什么要用scoped?

" 在vue组件中，在style标签上添加scoped属性，以表示它的样式作用于当下的模块，很好的实现了样式私有化的目的，这是一个非常好的机制。"

实现样式穿透有几种方法呢？

在scoped的情况下实现样式穿透：

  1. >>> 只作用于 css
  2. ::v-deep 只作用于 sass
  3. /deep/ 只作用于 less
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容