あなたが特定のn番目の子に到達するために必要な回数だけコンビネータを繰り返し、:first-child
pseudo-classと一緒にadjacent sibling combinatorsを使用することができます。これはan answer to a different questionでも言及されています。
すべての要素がE
の場合は、E:first-child
で始まり、次に対象となる要素に到達するまで次の子孫に+ E
を追加します。もちろん、同じ要素を使用する必要はありませんE
、もちろんです。どんなタイプ、クラス、IDなどに対してもそれを切り替えることができますが、重要なビットは:first-child
と+
の符号です。例として
は、そのol
の第li
を取得するために、以下のCSS3セレクター:
ol > li:nth-child(3)
のでようCSS2で複製されるであろう:
ol > li:first-child + li + li
イラスト:
<ol>
<li></li> <!-- ol > li:nth-child(1), ol > li:first-child -->
<li></li> <!-- ol > li:nth-child(2), ol > li:first-child + li -->
<li></li> <!-- ol > li:nth-child(3), ol > li:first-child + li + li -->
<li></li> <!-- ol > li:nth-child(4), ol > li:first-child + li + li + li -->
</ol>
there are no sibling combinators that look at preceding siblings (CSS2でもCSS3でも)、CSS2セレクタを使用して:nth-last-child()
または:last-child
をエミュレートすることはできません。
また、あなただけb
は(specに記載されているように)式an+b
に一定数である時、である特定の子供のための:nth-child(b)
をエミュレートすることができます。隣接する兄弟結合子だけでは複雑な公式は得られません。