疑似クラス nth-child

疑似クラス nth-child は、親の n 番目の子要素である要素を選択します。

構文

値

値	説明
数値	1 から始まる正の数。 対象とする要素の番号を指定します。 要素の番号は 1 から始まります。
odd	奇数の要素。
even	偶数の要素。
式	文字 n を使用した特別な式を組むことができます。 この n は、0（1ではなく）から無限大までのすべての整数を表します。 つまり、2n はすべての偶数（2番目から始まる）を意味します。 どのように理解するか？ n に 0 から順に数値を代入します： n = 0 の場合、2n は 0 になります - そのような要素はありません（要素の番号付けは1から）。 n = 1 の場合、2n は 2 になります - 2番目の要素。 n = 2 の場合、2n は 4 になります - 4番目の要素。 3n と書くと、それは3番目から始まる3つごとの要素になります。以下同様です。

例

この例では、親の 4 番目の子要素である li を赤色にします：

:

例

今度は、すべての偶数番目の li を赤色にします：

:

例

今度は、すべての奇数番目の li を赤色にします：

:

例

今度は、3番目から始まる3つごとの li を赤色にします：

:

例

セレクタでは要素の範囲を指定できます。 例えば、20 個の要素からなるリストがあり、 7 から 14 までの要素を選択したいとします。 これは次のように行えます：

: