CSS. Каскадные таблицы стилей. Подробное руководство.Символ-Плюс 2008

Рис. 2.9. Выбор элементов с множественными именами классов

Порядок слов на самом деле не имеет значения; подошло бы и warning urgent.

Теперь, скажем, вы хотите, чтобы все элементы, атрибут class которых имеет значение warning, были выделены полужирным шрифтом, те элементы, атрибут class которых имеет значение urgent, были выделены курсивом, а элементы, имеющие оба значения, получили серебряный фон. Это могло бы быть написано следующим образом:

.warning {font-weight:bold;} .urgent {font-style:italic;} .warning.urgent {background:silver;}

Объединяя два селектора класса, можно выбрать только те элементы, которые имеют оба именн класса, стоящие в любом порядке. Как видите, исходный код HTML содержит class="urgent warning", но CSS-ce-лектор записан такГ .warning, urgent. Несмотря на это, согласно правилу абзац *Прн работе с плутонием..,* будет расположен на серебряном фоне, как показано на рис. 2.9.

Если множественный селектор класса содержит имя, не входящее в разделенный пробелами список, то сопоставления не произойдет* Рассмотрим следующее правило:

p.warning.help {background:red;}

Как и можно было ожидать, селектор будет выбирать только те элементы р, атрибут class которых содержит слова warning и help. Следовательно, он не будет работать с элементами р, в атрибут class которых входят только слова warning или urgent. Однако он выберет такой элемент:

<р class="urgent warning Ье1р">Помогите!</р>