Выборка указанного количества элементов
В CSS 3 стало возможно выбирать указанное количество элементов через свойство nth-child
.
li:nth-child(-n+3) {color:red;} /* первые 3 пункта */ li:nth-last-child(-n+3) {color:red;} /* последние 3 пункта */ li:nth-child(n+4) {color:red;} /* все, кроме первых 3 пунктов */ li:nth-last-child(n+4) {color:red;} /* все, кроме последних 3 пунктов */ li:nth-child(2n) {color:red;} /* каждые 2 пункта */
Свойство nth-child
поддерживается всеми современными браузерами (Internet Explorer поддерживает с версии IE 9).
Выборка чётного и нечётного количество элементов
Выбирать чётное и нечётное количество элементов можно через значения even
и odd
.
li:nth-child(even) {color:red;} /* Чётные элементы */ li:nth-child(odd) {color:red;} /* Нечётные элементы */
Поддержать автора