zoukankan      html  css  js  c++  java
  • CSS中的/deep/理解

    一、含义

      /deep/ 深度选择器

    二、用法

      在vue中,我们为了避免父组件的样式影响到子组件的样式,会在style中加<style scoped>,这样父组件中如果有跟子组件相同的class名称或者使用选择器的时候,就不会影响到子组件的样式。

      我们在加了 scoped 之后样式会自动添加一个hash值。比如下面所示:

    .title[data-v-211e4c4a] {
        color: #ff0;
    }

      当你想在父组件修改子组件的样式,就需要使用/deep/。比如下面所示:

    <style scoped>
         /deep/ .title{
            color: #ff0;
        }
    </style>

    三、>>>、/deep/以及::v-deep

      以上三种的效果均是在父组件改变子组件的样式。  

      一些预处理器(例如Sass)可能无法正确解析>>>。在这些情况下,可以改用/deep/::v-deep组合器,两者都是它的别名,并且和>>>工作原理完全相同。

       

  • 相关阅读:
    GDI 设备环境句柄(2)
    GDI 像素(5)
    Api+Mvc增删查改
    sql语句全
    Mvc 导出
    触发器、事务
    计算时间戳的差
    SQL行转列经典例子(转载)
    Socket (套接字)通信
    MVC上传图片
  • 原文地址:https://www.cnblogs.com/gg-qq/p/14133400.html
Copyright © 2011-2022 走看看