CSS3 :nth-last-of-type()セレクタ
CSSセレクタ完全リファレンス定義と使い方
:nth-last-of-type(n)セレクタは、同じ型の中で最後からn番目の兄弟要素に一致します。
n数値、キーワード、または数式を指定できます。
ヒント：参照：:nth-last-child()セレクタ。このセレクタは、親要素内の最後からn番目の構造上の子要素に一致します。
ブラウザサポート
表内の数字は、そのプロパティをサポートする最初のブラウザのバージョン番号を示しています。
| セレクタ | |||||
|---|---|---|---|---|---|
| :nth-last-of-type() | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
その他の例
例 1
奇数と偶数は、インデックスが奇数または偶数である子要素に一致させるために使用できるキーワードです。
ここでは、最後から数えて奇数番目と偶数番目のp要素に、2つの異なる背景色を指定します：
p:nth-last-of-type(odd)
{
background:#ff0000;
}
p:nth-last-of-type(even)
{
background:#0000ff;
}
{
background:#ff0000;
}
p:nth-last-of-type(even)
{
background:#0000ff;
}
試してみる »
例 2
公式（an+ b）を使用します。説明：aは周期のサイズを表し、Nはカウンタ（0から始まる）で、bはオフセットです。
ここでは、最後から数えてインデックスが3の倍数であるすべてのp要素に背景色を指定します：
p:nth-last-of-type(3n+0)
{
background:#ff0000;
}
{
background:#ff0000;
}
試してみる »
その他の拡張