CSS3 Pre-Reference



:nth-of-type()

前から順番で指定したパターン・要素に合致

試す

コード

:nth-of-type(1) { }
p:nth-of-type(+2n+2) { }
div:nth-of-type(2n+4) { }
p:nth-of-type(-2n + 4) { }
p:nth-of-type(+3) { }
:nth-of-type(+3) { }

サンプル

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

○?:nth-of-type(1)

○?:nth-of-type(1)

○p:nth-of-type(-2n + 4)

×div:nth-of-type(2n+4)
div以外はカウントしないので、まだ2番目

○p:nth-of-type(+3)

○?:nth-of-type(+3)

コメントする


対応ブラウザ

Firefox
3.5~
Chrome/Safari
すべて
Opera
InternetExplorer
9

パラメータ

レベル 3
参考文献 Selectors Level 3#6.6.5.4. :nth-of-type() pseudo-class

解説

順番でパターンに合致する要素を示す疑似クラスです。指定されている要素以外はカウントしません。対象の要素が指定されていない場合の動作は未定義です。

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

トラックバック

投稿されたコメント