mozilla
您的搜索结果

    子选择器

    概述

    当使用  > 选择符分隔两个元素时,它只会匹配那些作为第一个元素的直接后代(子元素)的第二元素. 与之相比, 当两个元素由 后代选择器 相连时, 它表示匹配存在的所有由第一个元素作为祖先元素(但不一定是父元素)的第二个元素, 无论它在 DOM 中"跳跃" 多少次.

    语法

    元素1 > 元素2 { 样式声明 }
    

    示例

    span { background-color: white; }
    div > span {
      background-color: DodgerBlue;
    }
    

    当应用与如下标记时:

    <div>
      <span>Span 1. In the div.
        <span>Span 2. In the span that's in the div.</span>
      </span>
    </div>
    <span>Span 3. Not in a div at all</span>
    

    会得到下面的效果:

    Span 1. In the div. Span 2. In the span that's in the div.
    Span 3. Not in a div at all.

    规范

    Specification Status Comment
    CSS Selectors Level 3 Recommendation  
    CSS 2.1 Recommendation  

    浏览器兼容性

    Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
    Basic support (Yes) (Yes) 7.0 (Yes) (Yes)
    Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    Basic support ? ? ? ? ?

    相关

    文档标签和贡献者

    此页面的贡献者有: alimon, teoli
    最后编辑者: teoli,