CSS3 之：nth-child 选择器

:nth-child() 选择器

:nth-child() 是一个结构伪类函数，它可以选择某个元素包含的一个或多个特定的子元素。

eg：

标题

段落1

段落2

段落3

段落4

屏幕截图如下：

例：

:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素，不论元素的类型。

n 可以是数字、关键词或公式。

odd 和 even 是可用于匹配下标是奇数或偶数的子元素的关键词（第一个子元素的下标是 1）。

eg：

p:nth-child(odd)

{

background:#ff6;

}

p:nth-child(even)

{

background:#fcc;

}

标题

段落1

段落2

段落3

段落4

屏幕截图如下：

例:

使用公式 (an + b)。描述：表示周期的长度，n 是计数器（从 0 开始），b 是偏移值。

eg：

标题

段落1

段落2

段落3

段落4

段落5

段落6

段落7

段落8

段落9

屏幕截图如下：