css3有没有除第一个子元素以外的元素的选择器

html-css016

css3有没有除第一个子元素以外的元素的选择器,第1张

有的,包括:“:not(:first-child)”、“:nth-child(n+2)”两种方式。

1、:not(:first-child):其中,E:not(s)表示匹配所有不匹配简单选择符s的元素E,E:first-child匹配同级兄弟元素中的第一个E元素。

2、:nth-child(n+2):其中nth-child表示第几个son,n+2表示从第二个开始(即所有的n都是取从0开始的自然数)。

扩展资料:

css3中相关的选择器:

1、E:root :匹配文档的根元素。在HTML(标准通用标记语言下的一个应用)中,根元素永远是HTML

2、E:nth-child(n):匹配父元素中的第n个子元素E

3、E:nth-last-child(n):匹配父元素中的倒数第n个结构子元素E

4、E:nth-of-type(n):匹配同类型中的第n个同级兄弟元素E

5、E:nth-last-of-type(n):匹配同类型中的倒数第n个同级兄弟元素E

6、E:last-child:匹配父元素中最后一个E元素

7、E:first-of-type:匹配同级兄弟元素中的第一个E元素

8、E:only-child:匹配属于父元素中唯一子元素的E

9、E:only-of-type:匹配属于同类型中唯一兄弟元素的E

参考资料来源:百度百科-css3

:first-child选择某个元素的第一个子元素;

:last-child选择某个元素的最后一个子元素;

:nth-child()选择某个元素的一个或多个特定的子元素;

:nth-last-child()选择某个元素的一个或多个特定的子元素,从这个元素的最后一个子元素开始算;

:nth-of-type()选择指定的元素;

:nth-last-of-type()选择指定的元素,从元素的最后一个开始计算;

:first-of-type选择一个上级元素下的第一个同类子元素;

:last-of-type选择一个上级元素的最后一个同类子元素;

:only-child选择的元素是它的父元素的唯一一个了元素;

:only-of-type选择一个元素是它的上级元素的唯一一个相同类型的子元素;

:empty选择的元素里面没有任何内容。

1.1、nth-child(n)     父元素下的第n个子元素,n必须大于0,索引都是从1开始。

<div>

<p>多云转晴</p>

<p>多云转晴</p>

<p>多云转晴</p>

<p>多云转晴</p>

<p>多云转晴</p>

</div>

div p:nth-child(2){

background: skyblue

}

1.2、nth-child(odd)   父元素下的奇数子元素  等同于 nth-child(2n-1)

div p:nth-child(odd){

background: skyblue

}

1.3、nth-child(even)  父元素下的偶数子元素 同样区分子元素类型   等同于nth-child(2n)

div p:nth-child(even){

background: skyblue

}

二、nth-of-type  匹配属于父元素的特定类型的第 N 个子元素的每个元素 忽略不是该类型的元素的存在

<div>

<h3>天气</h3>

<p>多云转晴</p>

<p>多云转晴</p>

<p>多云转晴</p>

<p>多云转晴</p>

<p>多云转晴</p></div>

div p:nth-of-type(1){

background: skyblue

}

文章来源于网络,望采纳