關於第n個CSS的問題

Question

我有12個div。

我需要選擇標記爲THIS的標記。我在想某種第n個孩子的魔法？

謝謝！

即。

<div class="feature"></div> 
<div class="feature"></div> -> THIS 
<div class="feature"></div> 
<div class="feature"></div> 
<div class="feature"></div> -> THIS 
<div class="feature"></div> 
<div class="feature"></div> 
<div class="feature"></div> -> THIS 
<div class="feature"></div> 
<div class="feature"></div> 
<div class="feature"></div> -> THIS 
<div class="feature"></div> 

Answer 1

可以用許多表達使用nth-child pseudo-selector：

div.feature:nth-child(3n+2) { 
    background-color:#cccccc; 
} 

3n+2意味着每第三行開始的第二行。

順便說一下，在SitePoint的鏈接說，除了IE8支持的所有現代瀏覽器都有完全支持。 IE9已全力支持，但make sure you are not in compatibility mode。

Answer 2

您正在尋找需要選擇器:nth-child(3n+2)。

參考：http://css-tricks.com/examples/nth-child-tester/

Answer 3

建設關OB Sarfraz的回答，N可以設置爲3n - 1

.feature:nth-child(3n-1){ ... }