CSS3 :nth-child() 選擇器
完整CSS選擇器參考手冊實例
指定每個 p 元素匹配的父元素中第 2 個子元素的背景色：
p:nth-child(2)
{
background:#ff0000;
}
定義和用法
:nth-child(n) 選擇器匹配父元素中的第 n 個子元素，元素類型沒有限制。
n 可以是一個數字，一個關鍵字，或者一個公式。
提示: 請參閱選擇器。該選擇器匹配同類型中的第 n 個同級兄弟元素。
流覽器支持
表格中的數字表示支持該屬性的第一個流覽器版本號。
| 選擇器 | |||||
|---|---|---|---|---|---|
| :nth-child() | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
更多實例
實例 1
奇數和偶數是可以作為關鍵字使用用於相匹配的子元素，其索引是奇數或偶數（該索引的第一個子節點是1）。 在這裏，我們為奇數和偶數p元素指定兩個不同的背景顏色：
p:nth-child(odd)
{
background:#ff0000;
}
p:nth-child(even)
{
background:#0000ff;
}
實例 2
使用公式（an+ b）.描述：a代表一個迴圈的大小，N是一個計數器（從0開始），以及b是偏移量。 在這裏，我們對所有索引是3的倍數的p元素指定了背景顏色：
p:nth-child(3n+0)
{
background:#ff0000;
}