Структурные псевдоклассы
Часть раздела Мастерство CSS путешествия по HTML на Coddy. Урок 12 из 43.
Структурные псевдоклассы в CSS используются для стилизации элементов на основе их положения или структуры в HTML-документе. Они позволяют выбирать такие элементы, как первый дочерний элемент, последний дочерний элемент или конкретные дочерние элементы по номеру, без необходимости добавлять дополнительные классы или идентификаторы.
Распространённые примеры включают:
:first-child: выбирает первого потомка родительского элемента.
:last-child: выбирает последнего потомка родительского элемента.:nth-child(n): выбирает n-го потомка (например, каждого 2-го, 3-го и т. д.).
Попробуйте сами
В этом уроке нет задания по программированию.
Проверьте себяВ этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.
Все уроки раздела Мастерство CSS
1Мастерство селекторов — Комбинации
ВведениеСелектор потомковДочерний селекторСмежный селекторОбщий родственный селекторИтоговое испытание4Проект: Выпадающее меню
Добавление подменюОтображение подменюДополнительная стилизацияПоле ввода и кнопка2Интерактивные псевдоклассы
ПсевдоклассыЭффекты наведенияЭффекты фокусаАктивные стилиИтоговое испытание3Структурные псевдоклассы
Структурные псевдоклассыВыбор первого дочернего элементаВыбор последнего дочернего элементаСила шаблонов: использование nth-childЗадание на повторениеПотренируйтесь самостоятельно: Песочница Web