Page 174 - Сила CSS3 Освой новейший стандарт

174 • Глава 5. Повышение эффективности за счет псевдоклассов

они составляют набор потомков внешнего элемента. Внешний элемент называется
родителем (если это элемент предыдущего уровня) или предком (если он находится
на два и более уровня выше). Вложенные элементы на одном и том же уровне —
другими словами, имеющие общего родителя — предсказуемо называются братьями
или сестрами. По отношению к различным другим элементам определенный элемент
может выступать одновременно во всех этих ролях — точно так же, как вы можете
быть одновременно ребенком своих родителей и родителем своего ребенка. Все эти
термины описывают не абсолютное местоположение элемента, а местоположение
относительно других элементов.
Теперь, вспомнив терминологию, посмотрим, каким образом можно установить
взаимоотношения между элементами. Структурные псевдоклассы перечислены
в табл. 5.1.

Таблица 5.1. Структурные псевдоклассы
Псевдокласс Описание

:root Выбирает элемент, являющийся для документа корневым. В HTML
это всегда элемент html

:nth-child() В списке детей родительского элемента выбирает элемент
с указанным местоположением
:nth-last-child() То же, что и :nth-child(), но отсчет позиции начинается не с первого
ребенка, а с последнего и ведется в обратную сторону
:nth-of-type() В списке детей родительского элемента выбирает элемент
с указанным местоположением, но считаются только элементы
определенного типа (например, p, img и т. п.)
:nth-last-of-type() То же, что и :nth-of-type(), но отсчет позиции ведется не с первого
ребенка указанного типа, а с последнего
:first-child Выбирает первый дочерний элемент родительского элемента
(на рис. 5.1 первый дочерний элемент — это h1)
:last-child Выбирает последний дочерний элемент родительского элемента
(на рис. 5.1 последний дочерний элемент — это img)

:first-of-type Выбирает среди детей родительского элемента первого брата
указанного типа (на рис. 5.1 первый элемент p можно выбрать
с помощью селектора p:first-of-type)
:last-of-type Выбирает среди детей родительского элемента последнего брата
указанного типа

:only-child Выбирает элемент, являющийся единственным ребенком своего
родителя (на рис. 5.1 элемент ul — это единственный ребенок)

www.trk.kg