css выбрать четные элементы по классу

#html #css

Суть задачи

Есть список


  
asd
  
asd
  
asd
  
asd


.hidden {display: none;}


Если применить 

li:not(.hidden):nth-child(2n) {background: red;}


То он применит сначала :nth-child(2n), а потом проверит на наличие класса .hidden.
Так вот задача в том чтобы :nth-child(2n) применился к коллекции li:not(.hidden). Как
сделать через JS - понятное дело, добавить соответствующие классы для "видимых четных",
как это сделать на CSS ?
    

Ответы

Ответ 1

как вариант



.block > div {
  background: #ccc;
  margin: 10px 0;
  width: 100px;
}

.block > div:nth-of-type(2n) {
  background: red;
}

.hidden {
  display: none;
}

  
asd
  asd
  
asd
  
asd
  asd
  asd
  
asd
  
asd
  
asd
  
asd