4

ここで比較的単純なことを達成するために頭を悩ませています。

ページの 3 番目と 4 番目の要素をすべて選択する必要がありますが、css :nth-child() を使用してそれを行うにはどうすればよいですか?

JS の回答も歓迎します。

どうもありがとう。

***編集

申し訳ありませんが、私の質問はひどく書かれていました。必要なものの例を以下に添付しました。

これは私が必要とする結果です http://jsfiddle.net/8FXL6/

        <li></li>
        <li class="highlight"></li>
        <li class="highlight"></li>
        <li></li>
        <li></li>
        etc

クラス名をハードコーディングせずに。

4

4 に答える 4

12 
*:nth-child(3),*:nth-child(4){
}

技術的には、これにより、コンテナー内の 3 番目または 4 番目の子であるすべての要素が選択されます。3 番目または 4 番目の要素 (3、4、6、8 など)ごとに選択する場合は、次を使用します。

*:nth-child(3n),*:nth-child(4n){
}

デモ

編集から、次のものが必要です。

li:nth-child(4n-2),li:nth-child(4n-1){
}

デモ

于 2012-11-15T11:22:47.110 に答える
4

コンマを使用して、nth-childを使用してセレクターを組み合わせて要素を取得できます。

ライブデモ

elements = $('div .className :nth-child(3), div .className :nth-child(4)');
于 2012-11-15T11:22:43.233 に答える
1

cssだけでやってみたらどうですか？

3 つおきの要素:

*:nth-child(3n+3) {color: red}

4 要素ごと:

*:nth-child(4n+4) {color: blue}

jsfiddle のデモは次のとおりです: http://jsfiddle.net/dufsx/

于 2012-11-15T11:29:42.730 に答える
0

これは CSS だけで解決できます

 *:nth-child(4n+2){background:blue;color: white;}
 *:nth-child(4n+3){background:blue;color: white;}

ライブデモ

于 2012-11-16T04:09:35.230 に答える