Возможно выбрать отдельно только 1, 4, 7, 10 итемы? и 3, 6, 9,12 также отдельно?

Question

[olya_097]

Возможно выбрать отдельно только 1, 4 , 7, 10 итемы? и 3, 6 , 9,12 также отдельно?

Answer 1

[Сергей delphinpro]

.item:first-child,
.item:nth-child(3n+4) {
  // 1,4,7,10...
}
.item:nth-child(3n+3) {
  // 3,6,9,12...
}

Для самостоятельного решения других вариантов: www.topdesignagencies.com/nth-test

UPD
что-то я усложнил первый пример

.item:nth-child(3n+1) {
  // 1,4,7,10...
}

Comments

[olya_097]

Сергей delphinpro, спасибо

[olya_097]

olya_097, извиняюсь
уверены что .item:nth-child(4n+3) это правильно?

[Сергей delphinpro]

olya_097, нет. ошибся в цифрах местами, опечатка. исправил ответ.

[olya_097]

Сергей delphinpro, cпасибо

Answer 2

[Александр Аксентьев]

https://stackoverflow.com/a/13691714/1603055

:nth-child(3n) {
// 3, 6 ,9, 12
}

https://stackoverflow.com/a/41986487/1603055

:nth-child(3n - 2) {
  // 1 4 7 10
}

Ну уж в крайнем случае просто перечислить с запасом варианты любые совсем понятно как:

:nth-child(1),
:nth-child(4),
:nth-child(7),
:nth-child(10),
 {
  // 1 4 7 10
}