mozilla
Your Search Results

    :nth-of-type

    概要

    CSS の :nth-of-type 擬似クラス は、文書木内の自分より前に、同じ要素名の an+b-1 個の兄弟要素を持ち、親要素を持つ要素とマッチします。ここで、n にはゼロか正の数が入ります。引数の構文について詳しくは、 :nth-child をご覧ください。親要素内の出現場所や、これより前にある他のタグに関わらず、同じタイプのタグを確実に選択したい場合、これは柔軟で便利な擬似セレクタです。

    構文

    element:nth-of-type(an + b) { style properties }
    

    この例では各段落の文字揃えを左右いずれかにします。

    CSS

    p:nth-of-type(2n+1) { text-align: left; }
    p:nth-of-type(2n) { text-align: right; }

    HTML

    <div>
        <p>First paragraph (left aligned)</p>
        <p>Second paragraph (right aligned)</p>
        <p>Third paragraph (left aligned)</p>
    </div>

    仕様

    仕様書 策定状況 コメント
    Selectors Level 4 草案 変更なし
    Selectors Level 3 勧告 初回定義

    ブラウザ実装状況

    機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
    基本サポート 1.0 3.5 (1.9.1) 9.0 9.5 3.1
    機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    基本サポート 2.1 1.0 (1.9.1) 9.0 9.5 3.1

    関連情報

    ドキュメントのタグと貢献者

    Contributors to this page: sosleepy, ethertank
    最終更新者: ethertank,
    サイドバーを隠す