Css3 选择器——结构性伪类

结构性伪类

E:nth-child(n) 表示E标签父级下的第n个标签,且标签类型为"E"
E:nth-child(odd)表示E标签父级下的奇数标签,且标签类型为"E"
E:nth-child(even)表示E标签父级下的偶数标签,且标签类型为"E"
E:nth-child(2n-1)表示E标签父级下的第1,3,5…个标签,且标签类型为"E"
E:nth-last-child(n)表示E标签父级下的第n个标签,从后向前计算(使用方法与E:nth-child(n)用法相同
:last-child==:nth-last-child(1)
:first-child==:nth-child(1)

下面通过一个具体的例子了解一下





结构性伪类



 

"qz b">乔治

"pq">佩奇

"pf b">猪爸爸

"pm g">猪妈妈

"b-pg">猪爷爷

"sx">苏西

"rbe">瑞贝尔

"dn b">丹尼

"dm g">丹美

E:nth-of-type(n) 表示E标签父级下的第n个E类型的标签
E:nth-last-of-type(n)表示E标签父级下的第n个E类型的标签,从后往前数

下面通过一个简单的例子来了解一下





结构性伪类



 

"qz b">乔治

"pq">佩奇

"pf b">猪爸爸

"pm g">猪妈妈

"b-pg">猪爷爷

"sx">苏西

"rbe">瑞贝尔

"dn b">丹尼

"dm g">丹美

如图所示
Css3 选择器——结构性伪类_第1张图片

你可能感兴趣的:(css,html)