使用nth-child制作國際象棋模式

Question

我想要在這里做一些相對簡單的事情。

我需要在頁面上選擇每個第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

沒有硬編碼類名。

Answer 1

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

從技術上講，它選擇容器中第3個或第4個子元素的每個元素。 如果要選擇每個第3或第4個元素（3,4,6,8等），請使用：

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

DEMO

在您的編輯中，您需要：

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

DEMO

Answer 2

您可以使用逗號將使用nth-child的選擇器組合起來獲取元素，

現場演示

elements = $('div .className :nth-child(3), div .className :nth-child(4)');

Answer 3

如何僅使用css？

每三個元素：

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

每四個要素：

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

這是關於jsfiddle的演示： http ： //jsfiddle.net/dufsx/

Answer 4

這可以僅使用CSS來解決

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

現場演示