CSS nth-child-соответствие 2-го, 5-го, 8-го,… элементов




css3 css-selectors (3)

На этот вопрос уже есть ответ здесь:

У меня есть список HTML, который с помощью CSS я размещаю в блоках строк по 3 столбца.

Таким образом, если список состоит из 6 элементов, это будет 2 строки по 3 столбца, 9 элементов - 3 x 3, 12 элементов - 4 x 3 и т. Д. И т. Д.

Как с помощью селектора CSS nth-child выбрать средний элемент каждой строки? т.е. 2-й, 5-й, 8-й, ... элементы.

Заранее спасибо!


Если я правильно понимаю ваш вопрос :nth-child(3n+2) - это то, что вы хотите. (См., Например, этот JSfiddle )


Это должно работать:

:nth-child(3n+2) {
    // your css rules here
}

В основном, 3n означает «каждый третий», а +2 означает «начиная с номера два».

Подробнее читайте здесь: https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-child






css-selectors