CSS3 Pre-Reference



:nth-last-child()

後ろから順番で指定したパターンに合致

試す

コード

:nth-last-child(1) { /* ○ */ }
:nth-last-child(+2n+2) { /* ○ */ }
:nth-last-child(+4) { /* ○ */ }
p:nth-last-child(+4) { /* ○ */ }
p:nth-last-child(+ 5) { /* × */ }
p:nth-last-child(8 n) { /* × */ }
p:nth-last-child(9n) { /* ○ */ }

サンプル

○×と右側のOK/NGが合致していれば正しいです。

○:nth-last-child(9n)

×:nth-last-child(8 n)
数字とnの間のスペースは不可

×:nth-last-child(-2n + 5)
nはゼロ以上の整数

×p:nth-last-child(+ 5)
符号と数字の間のスペースは不可

○p:nth-last-child(+4)

○p:nth-last-child(+2n+2)

○:nth-last-child(-2n + 5)

×p:nth-last-child(+2n+2)
これはdiv

○:nth-last-child(1)

コメントする


対応ブラウザ

Firefox
3.5~
Chrome/Safari
Opera
InternetExplorer
9

パラメータ

レベル 3
参考文献 Selectors Level 3#6.6.5.3. :nth-last-child() pseudo-class

解説

順番で最後から数えてパターンに合致する要素を示す疑似クラスです。要素名が指定されていても、他の要素もカウントします。

括弧の間(「:nth-child(」と「)」の間)に入れるパターンは”:nth-child()”と同様です。その他、詳しい情報は”:nth-child()”をご参考ください。

トラックバック

投稿されたコメント