Использование контекстуальных селекторов
В селекторе вы можете предварить имя элемента именами одного или нескольких элементов-предков (родительский, родительский плюс родительский родителя и т.д.), и правило будет применено только к элементам с этим именем, которые являются вложенными подобным образом. Селектор, который включает один или несколько элементов-предков, называется контекстуальным (contextual) селектором. Селектор, который не включает имен элементов-предков (подобно тем, с которыми вы имели дело в предыдущем разделе), называется родовым (generic) селектором.
Если определенное свойство для одного и того же элемента имеет одну установку в правиле с контекстуальным селектором, и другую установку в правиле с родовым селектором, установка в правиле с контекстуальным селектором доминирует, поскольку является более конкретизированной.
Предположим, что следующий элемент является корневым элементом XML-документа:
<MAPS> <CITY> <NAME>Santa Fe</NAME> <STATE>New Mexico</STATE> </CITY> <STATE>California</STATE> </MAPS>
Следующие правила в присоединяемой таблице стилей заставят браузер отформатировать "New Mexico" обычным шрифтом, а "California" – курсивом:
CITY STATE {font-style:normal} STATE {font-style:italic}
Хотя содержимое New Mexico элемента STATE отвечает обоим контекстуальным селекторам в правиле CITY STATE и родовому селектору в правиле STATE , селектор CITY STATE является более конкретным и, следовательно, имеет приоритет. (Подробнее о приоритетах и конфликтах правил вы узнаете в разделе "Присвоение значений в таблицах каскадных стилей" далее в этой лекции.)
Примечание. Имейте в виду, что не следует помещать запятые между именами элементов в контекстном селекторе. В противном случае правило будет применено ко всем элементам (как было описано в предыдущем разделе), но не к последнему дочернему элементу в списке
