Существует возможность присоединить стиль только к тем элементам HTML/XHTML, которые обладают специфическими атрибутами. Для этого следует перечислить нужные атрибуты в квадратных скобках рядом с именем элемента до определения стиля:
div[align] { font-style: italic }
div[align=left] {font-style: italic }
div[title~="bibliography"] { font-size: smaller }
div[lang|="en"] {color: green }
Первый пример – самый простой. Он выделяет курсивом текстовое содержимое только тех тегов <div>, которые имеют атрибут align, независимо от значения этого атрибута. Второй пример чуть сложнее. Он затрагивает только те теги <div>, у которых атрибут align имеет значение left.
Третья строчка относится к тегам <div>, чей атрибут title содержит слово bibliography, отделенное одним или несколькими пробелами. Частичное совпадение снова не считается. Если бы вы указали div[title~="a"], стиль относился бы только к тем тегам <div>, у которых атрибут title содержит букву «а», отделенную пробелами или стоящую
в начале или конце названия.
Последний пример определяет теги <div>, у которых атрибуту lang присвоен список слов, разделенных дефисами и начинающихся на «en». Под это условие подходят такие атрибуты как lang=en, lang=en-us и lang=en-uk.
Вы можете сочетать универсальный селектор с селекторами атрибутов, чтобы вашему определению соответствовал любой элемент с указанным атрибутом. Например:
*[class=comment] { display: none }
Этот селектор спрячет все элементы документа, у которых атрибут class имеет значение comment.
Netscape, Firefox, Opera и другие современные броузеры поддерживают селекторы атрибутов. По неизвестным причинам Internet Explorer этого не делает.