Использование nth-child для выбора четного, а затем нечетного числа элементов

Попробуйте:

ul li:nth-child(5n),
ul li:nth-child(5n-1),
ul li:nth-child(5n-2) {
color:rgb(0,0,255);
}

ul li:nth-child(5n-3),
ul li:nth-child(5n-4) {
color:rgb(255,255,255);
}

[Мысли вслух]

• Каждый пятый элемент, начиная с 1, белый
• Каждый пятый элемент, начиная с 2, белый
• Каждый 5-й элемент, начинающийся с 3, синий
• Каждый 5-й элемент, начинающийся с 4, синий
• Каждый 5-й элемент, начинающийся с 5, синий

Чтобы перевести это повторяя шаблон в :nth-child(an+b), нам нужно пять селекторов:

• a будет 5
• b будет от 1 до 5

li:nth-child(5n+1),
li:nth-child(5n+2) {
  background-color: #FFF;
}
li:nth-child(5n+3),
li:nth-child(5n+4),
li:nth-child(5n+5) {
  background-color: #00F;
}

<ul>
  <li>1: White</li>
  <li>2: White</li>
  <li>3: Blue</li>
  <li>4: Blue</li>
  <li>5: Blue</li>
  <li>6: White</li>
  <li>7: White</li>
  <li>8: Blue</li>
  <li>9: Blue</li>
  <li>10: Blue</li>
  <li>11: White</li>
  <li>12: White</li>
</ul>