Селекторы атрибутов. CSS позволяет создавать правила, сопоставляемые элементам с атрибутами, определенными в исходном коде HTML-документа. Селекторы атрибутов могут сопоставляться в следующих четырех случаях. • [att] – если для элемента установлен атрибут att независимо от значения этого атрибута. • [att=val] – когда значение атрибута att данного элемента в точности равно val. • [att~=val] – если значением атрибута att данного элемента является список слов, разделенных пробелами, одно из которых в точности равно val. • [att|=val] – когда значением атрибута att элемента является начинающийся со слова val список разделенных дефисом слов. Сопоставление всегда начинается с начала значения атрибута. Чтобы хорошо разобраться с данным свойством, рассмотрите ряд примеров и подробных комментариев к ним. Итак, следующее правило CSS сопоставляется всем элементам P, для которых описан атрибут align, независимо от его значения: P[align] { color: blue; }. В следующем примере селектор, то есть правило CSS, сопоставляется всем элементам SPAN, у которых значение атрибута class в точности равно example: Span[class=example] { color: blue; }. Для обращения к нескольким атрибутам элемента или многократного обращения к одному и тому же атрибуту можно использовать несколько селекторов атрибутов. В следующем примере селектор сопоставляется всем элементам TABLE, у которых значение атрибута width в точности равно 90 %, а значение атрибута height в точности равно 50 %: Table[width="90%"][height="50%"] { color: blue; }. Следующие селекторы иллюстрируют различия между знаками = и ~=. Первый селектор будет сопоставляться, например, значению copyright copyleft copyall атрибута rel. Второй селектор будет сопоставляться только в том случае, если значение атрибута href равно http://www.yoursite.com/: A[rel~="copyright"]. A[href="http://www.yoursite.com/"]. Следующее правило скрывает все элементы, атрибут lang которых имеет значение fr, то есть элементы с текстом на французском языке: *[lang=fr] { display : none }. Следующее правило будет сопоставляться тем значениям атрибута lang, которые начинаются с ru, включая ru, ru-RU и ru-UA: *[lang|="ru"] { color : red }.