:nth-child(an+b)【an+b番目の子要素】疑似クラス
:nth-last-child(an+b)【末尾からan+b番目の子要素】疑似クラス
メモ
- 先頭あるいは末尾から an + b番目の子要素の疑似クラス (1オリジン:先頭あるいは末尾は1番目)
- 反復的な定義が可能
- 要素のカウントは兄弟要素を全て含む (:nth-*-of-type【該当子要素】系は同じ要素の兄弟のみ)
- 関連
- 要素については、HTML5 リファレンス メモ 参照
外部リンク
構文
構文 (:ホワイトスペース挿入可能位置) | 説明 |
---|---|
E:nth-child(an +b) { スタイル定義 } | 親要素の先頭からan + b番目の子E要素に適用 (a 個毎に反復) |
E:nth-last-child(an +b) { スタイル定義 } | 親要素の末尾からan + b番目の子E要素に適用 (a 個毎に反復) |
E:nth-child (b) { スタイル定義 } | 親要素の先頭からb番目の子E要素に適用 (単一要素:上記の a = 0 に相当) |
E:nth-last-child (b) { スタイル定義 } | 親要素の末尾からb番目の子E要素に適用 (単一要素:上記の a = 0 に相当) |
E:nth-child (an-b ) { スタイル定義 } | 親要素の先頭からan - b番目の子E要素に適用 (a 個毎に反復) |
E:nth-last-child (an -b) { スタイル定義 } | 親要素の末尾からan - b番目の子E要素に適用 (a 個毎に反復) |
E:nth-child (odd) { スタイル定義 } | 親要素の先頭から奇数番目の子E要素に適用 (2n + 1 に相当) |
E:nth-last-child (odd) { スタイル定義 } | 親要素の末尾から奇数番目の子E要素に適用 (2n + 1 に相当) |
E:nth-child (even) { スタイル定義 } | 親要素の先頭から偶数番目の子E要素に適用 (2n に相当) |
E:nth-last-child (even) { スタイル定義 } | 親要素の末尾から偶数番目の子E要素に適用 (2n に相当) |
変数 | 説明 |
a (整数) | 反復の要素数 正の整数:順方向の反復 負の整数:逆方向の反復 |
b (正数) | 反復開始要素オフセット位置 (nに0から順に適用して有効範囲内になった位置が開始位置) |
n | 0 ≦ n の整数を適用 |
例
<th>要素 | <td>要素 |
---|
1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33/11 |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
2 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 10 |
3 | 9 | |||||||||||||||||||||||||||||||
4 | 8 | |||||||||||||||||||||||||||||||
5 | 7 | |||||||||||||||||||||||||||||||
6 | 6 | |||||||||||||||||||||||||||||||
7 | 5 | |||||||||||||||||||||||||||||||
8 | 4 | |||||||||||||||||||||||||||||||
9 | 3 | |||||||||||||||||||||||||||||||
10 | 2 | |||||||||||||||||||||||||||||||
11/33 | 32 | 31 | 30 | 29 | 28 | 27 | 26 | 25 | 24 | 23 | 22 | 21 | 20 | 19 | 18 | 17 | 16 | 15 | 14 | 13 | 12 | 11 | 10 | 9 | 8 | 7 | 6 | 5 | 4 | 3 | 2 | 1 |
<th>要素 | <td>要素 |
---|
1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33/11 |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
2 | 01 | 02 | 03 | 04 | 05 | 06 | 07 | 08 | 09 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 10 |
3 | 9 | |||||||||||||||||||||||||||||||
4 | 8 | |||||||||||||||||||||||||||||||
5 | 7 | |||||||||||||||||||||||||||||||
6 | 6 | |||||||||||||||||||||||||||||||
7 | 5 | |||||||||||||||||||||||||||||||
8 | 4 | |||||||||||||||||||||||||||||||
9 | 3 | |||||||||||||||||||||||||||||||
10 | 2 | |||||||||||||||||||||||||||||||
11/33 | 32 | 31 | 30 | 29 | 28 | 27 | 26 | 25 | 24 | 23 | 22 | 21 | 20 | 19 | 18 | 17 | 16 | 15 | 14 | 13 | 12 | 11 | 10 | 9 | 8 | 7 | 6 | 5 | 4 | 3 | 2 | 1 |