CSS :nth-last-child() パシフィア

定義と使用法

CSS :nth-last-child(n) パシフィアは、親要素の最後のn番目の子要素として機能するすべての要素に一致します。

n 数字/インデックスまたはキーワード（odd または even）または公式（ an+ b）

ヒント：参照 :nth-last-of-type() パシフィアは、親要素の中で指定されたタイプの最後のn番目の子要素を選択するために使用されます。 n 子要素を持つ要素のものです。

例

例1

親要素の最後の2番目の子要素として機能する<p>要素の背景色を指定します：

p:nth-last-child(2) {
  background-color: red;
}

実際に試してみてください

例2

odd および even キーワードであり、奇数または偶数のインデックスを持つ子要素に一致できます。

ここでは、インデックスが奇数または偶数の<p>要素の異なる背景色を指定しています：

p:nth-last-child(odd) {
  background-color: red;
}
p:nth-last-child(even) {
  background-color: blue;
}

実際に試してみてください

例3

公式（an+ b説明：a 整数ステップを示し、nは0から始まるすべての非負整数です、b 整数オフセットです。

ここでは、インデックスが3の倍数のすべての<p>要素の背景色を指定しています：

p:nth-last-child(3n+0) {
  background-color: red;
}

実際に試してみてください

CSS文法

:nth-last-child(index | odd | even | an+b) {
  css宣言;
}

技術的詳細

ブラウザのサポート

テーブルの数字は、そのパシフィアの最初のバージョンを指定しています。