Internet Explorer 8 で :nth-child をエミュレートするにはどうすればよいですか?

Internet Explorer 8 で :nth-child をエミュレートする

Internet Explorer 8 には、:nth-child セレクターがサポートされていないため、問題が発生する可能性があります。親要素内の位置に基づいて要素のスタイルを設定しようとするとき。このような場合、代替ソリューションが必要になります。

幸いなことに、IE7 と IE8 では、隣接兄弟コンビネータ () を利用して同様の結果を達成できます。たとえば、次の CSS スニペット:

#nav-primary ul li:first-child a {
    border-top: 5px solid red;
}
/* ... */
#nav-primary ul li:first-child + li + li a {
    border-top: 5px solid green;
}

は次と同等です:

#nav-primary ul li:nth-child(1) a {
    border-top: 5px solid red;
}
/* ... */
#nav-primary ul li:nth-child(3) a {
    border-top: 5px solid green;
}

ただし、この手法では :nth-child( のより複雑なバリエーションをエミュレートできないことに注意することが重要です。 )、:nth-child(odd) や :nth-child(4n 3) など。

以上がInternet Explorer 8 で :nth-child をエミュレートするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。