美文网首页
vue css深度选择器

vue css深度选择器

作者: 回不去的那些时光 | 来源:发表于2020-01-18 16:04 被阅读0次

    使用scoped后,父组件的样式将不会渗透到子组件
    如果想在使用了scoped不污染全局样式的情况下,依然可以修改子组件的样式,可以使用深度选择器

    在我们想穿透的选择器前边添加

    >>> 或者 /deep/ 或者 ::v-deep
    
    .nav-theme-dark >>> .logo {
        color: #fff;
        background-color: rgba(1,1,1,0.5);
    }
    
    .nav-theme-dark {
      /deep/ .logo {
        color: #fff;
        background-color: rgba(1,1,1,0.5);
      }
    }
    

    注意

    在scss中不能使用这种方式

    <style scoped>
    .a >>> .b { /* ... */ }
    </style>
    

    相关文章

      网友评论

          本文标题:vue css深度选择器

          本文链接:https://www.haomeiwen.com/subject/negkzctx.html