当前位置:首页 » 《关注互联网》 » 正文

前端:css less语法 /deep/ 深度影响的用法

12 人参与  2024年03月27日 19:15  分类 : 《关注互联网》  评论

点击全文阅读


css中通常会在 style 标签内添加 scoped 来避免父组件对子组件的影响,添加了之后只能修改当前组件的样式。

这样做的原理是通过在打包的时候给每个样式都添加一个独一无二的hash值,从而避免父组件对子组件的样式的影响。

添加后控制台显示的样式就会像这样:

 

 

设置了上述scoped的话,如果想要在父组件中修改子组件的样式时应该怎么样做呢?

如果去掉scoped的话就会影响全局样式,但是加上scoped又不能在当前组件修改子组件的样式,这个时候就可以使用 /deep/ 了。

/deep/ 表示深度选择器

用法:

 注:

除了 /deep/ 以外,>>> 和 ::v-deep也可以实现同样的效果

注意:/deep/ 只能在像 less , sass 等css预处理器中使用,在原生css中使用无效,所以原生css当中应使用 >>> 。

 


点击全文阅读


本文链接:http://zhangshiyu.com/post/86843.html

<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

关于我们 | 我要投稿 | 免责申明

Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1