css - IE8：nth-​​of-type（n）の代わりに何を使用しますか？

Question

次のCSSコードを継承して、一連の段落と一連のリスト項目の後半の要素を最初に非表示にしました。

.profileSection p:nth-of-type(n+2) {
    display: none;
}

.profileSection li:nth-of-type(n+6) {
    display: none;
}

明らかに、このコードはIE8では機能しません。これらの要素を非表示にする別の方法は何ですか？

Answer 1

これについての議論は次のとおりです。

http://www.thebrightlines.com/2010/01/04/alternative-for-nth-of-type-and-nth-child/

ライターは、を使用して特定の子要素を参照できると述べています

tagname + tagname + etc

または、を使用して一般的な子を取得します

* + * + etc

個人的には、それらのアイテムに特別なクラスを追加するだけです。

Answer 2

+、隣接する兄弟セレクターを使用すると、すぐ隣にあるすべての兄弟を選択できます。あなたの場合：.profileSection p+p。（これを行う必要がある場合は、条件付きコメントのように、他のブラウザーに表示されないように、何かでラップすることを検討してください。）

ただし+、マークアップに要素以外のものが<p>隣接している場合は役に立ちません。例えば：

<p>Alpha</p>
<h4>Header</h4>
<p>Beta</p>

サイトに何らかのshivまたはmoderizr機能がまだない場合（他の多くの同様の問題に役立ちます）、要素に特別なクラスを追加し、そのクラスを使用することを選択するのが最も簡単です。

Answer 3

selectivizrをダウンロードして含めることもできます。これにより、CSS3セレクターがIE6-8で機能するようになります。