您现在的位置:首页 >> 前端 >> 内容

CSS3后代选择器和同级选择器简介和实例

时间:2016/1/11 9:18:51 点击:

  核心提示:CSS selector level 3规范中定义了一些和文档层级结构有关的连接选择器(或称组合选择器),分为后代选择器(Descendant combinator/Child combinators...

CSS selector level 3规范中定义了一些和文档层级结构有关的连接选择器(或称组合选择器),

分为后代选择器(Descendant combinator/Child combinators)同级选择器(Sibling combinators)

其中后代选择器分以下3个:

1. 空格。p p: 表示p是p的后代元素, p是p的祖先。该选择器选择所有p下的p后代元素。

2. 箭头(>)。表示直系关系。p > p 表示p的儿子辈的元素。

3. 星号(*)。表示隔代关系。p * p表示p的孙子辈及之后的元素。

在线实例:https://wow.techbrood.com/fiddle/15759

同级选择器分为以下2个:

1. 加号(+)。表示紧随关系。h1 + h2: 表示紧跟在h1后面的h2元素。
2. 波浪号(~)。表示后续关系。h1 ~ h2: 表示和h1元素同在一个父元素下的后续h2元素(中间可以隔着其他元素)。

在线实例:https://wow.techbrood.com/fiddle/15761

Tags:CS SS S3 3后 
作者:网络 来源:陈小峰-iefree
  • 上一篇:CSS Media Query
  • 下一篇:Bootstrap导航栏