在CSS3

Question

使用第n個子我想從第一個

實施例選擇每組三個元件：

<ul> 
    <li>1</li> <!-- This one --> 
    <li>2</li> <!-- This one --> 
    <li>3</li> <!-- This one --> 
    <li>4</li> 
    <li>5</li> 
    <li>6</li> 
    <li>7</li> <!-- This one --> 
    <li>8</li> <!-- This one --> 
    <li>9</li> <!-- This one --> 
    <li>10</li> 
</ul> 

所以不得不添加背景一個1，2，3; 7，8，9; 13，14，15等。 我沒有總金額<li>

是否有隻使用nth-child（）的解決方案？

Answer 1

是的，有明顯的使用nth-child的解決方案。

li:nth-child(6n+1), 
li:nth-child(6n+2), 
li:nth-child(6n+3){ 
    color: blue; 
    background-color: red; 
} 

從根本上來說，'孩子'會爲你製造一種配方。只需用你想檢查哪個孩子可以工作的任何號碼來替換'n'即可。