使用第n種類型來選擇奇數序列的網格項目

Question

所以我有這種網格類型的帖子，當你向下滾動時，它們會一直出現。

請參見圖片明白我的意思

注意，選擇是2,3，6,7，10，11，14,15等..，我可以似乎沒有得到任何CSS類型的公式來推導這些結果。

任何人都知道如何做出這樣的選擇？任何幫助，將不勝感激。

Answer 1

這將是4n+2和4n+3重複開始每4個元素2和3

.wrapper { 
 
    width: 100px; 
 
} 
 
.wrapper div { 
 
    float: left; 
 
    width: 50px; 
 
    box-sizing: border-box; 
 
    height: 50px; 
 
    border: 1px solid #ddd; 
 
} 
 

 
.wrapper div:nth-child(4n+2), 
 
.wrapper div:nth-child(4n+3) { 
 
    background-color: green; 
 
}

<div class="wrapper"> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
</div>

Answer 2

請嘗試使用以下選擇：

li:nth-child(4n+2) { 
 
    background-color: green; 
 
} 
 
li:nth-child(4n+3) { 
 
    background-color: yellow; 
 
}

<ul> 
 
    <li>01</li> 
 
    <li>02</li> 
 
    <li>03</li> 
 
    <li>04</li> 
 
    <li>05</li> 
 
    <li>06</li> 
 
    <li>07</li> 
 
    <li>08</li> 
 
    <li>09</li> 
 
    <li>10</li> 
 
    <li>11</li> 
 
    <li>12</li> 
 
    <li>13</li> 
 
    <li>14</li> 
 
    <li>15</li> 
 
    <li>16</li> 
 
    <li>17</li> 
 
    <li>18</li> 
 
    <li>19</li> 
 
    <li>20</li> 
 
    <li>21</li> 
 
    <li>22</li> 
 
    <li>23</li> 
 
    <li>24</li> 
 
    <li>25</li> 
 
    <li>26</li> 
 
    <li>27</li> 
 
    <li>28</li> 
 
    <li>29</li> 
 
    <li>30</li> 
 
    <li>31</li> 
 
    <li>32</li> 
 
    <li>33</li> 
 
    <li>34</li> 
 
    <li>35</li> 
 
    <li>36</li> 
 
    <li>37</li> 
 
    <li>38</li> 
 
    <li>39</li> 
 
    <li>40</li> 
 
    <li>41</li> 
 
    <li>42</li> 
 
    <li>43</li> 
 
    <li>44</li> 
 
    <li>45</li> 
 
    <li>46</li> 
 
    <li>47</li> 
 
    <li>48</li> 
 
    <li>49</li> 
 
    <li>50</li> 
 
</ul>