使用第n个类型选择奇数序列

Question

所以我有这种网格类型，帖子在向下滚动时会一直显示。

请看图片看看我的意思

请注意，选择是2,3,6,7,10,11,14,15等等。而且我似乎无法得到任何类型公式的CSS n来推导这些结果。

有人知道如何做出这样的选择吗？任何帮助，将不胜感激。

Answer 1

从{2}开始重复每个第4个元素4n+2和4n+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>