Комбинирование псевдоклассов

В CSS2.1 можно комбинировать псевдоклассы в одном селекторе. Например, можно сделать так, чтобы при зависании над ними указателя мыши непосещенные ссылки становились красными, а посещенные ссылки – красно-коричневыми:

a:link:hover {color: red;}
a:visited:hover {color: maroon;}

Порядок, в котором они задаются, фактически неважен; вы могли бы написать a:hover:link и получить такой же результат. Можно назначить отдельные стили оформления при зависании указателя для непосещенных и посещенных ссылок, написанных на другом языке, например немецком:

a:link:hover:lang(de) {color: gray;}
a:visited:hover:lang(de) {color: silver;}

Будьте осторожны, чтобы не объединить взаимоисключающие псевдоклассы. Например, ссылка не может быть одновременно и посещенной, и непосещенной, так что a:link:visited не имеет никакого смысла. Агенты пользователя, скорее всего, проигнорируют такой селектор и таким образом проигнорируют все правило. Однако такое поведение не является гарантированным, потому что разные броузеры обрабатывают ошибки по разному. Internet Explorer для Windows вплоть до версии IE6 не распознает правильно комбинированные псевдоклассы.

Как и в случае с сочетаниями класс-значение, он обратит внимание только на последний из комбинированных псевдоклассов. Таким образом, если задан a:link:hover, более старые версии IE/Win заметят часть :hover, но не заметят часть селектора :link. В IE7 такого ограничения нет; он правильно обрабатывает комбинированные псевдоклассы.

Оцените статью: (0 голосов)
0 5 0

Статьи из раздела CSS на эту тему:
Выбор дочерних элементов
Выбор конкретного атрибута
Выбор между селектором классов и селектором идентификаторов
Выбор на основании конкретного значения атрибута
Выбор первого дочернего элемента

Вернуться в раздел: CSS / 2. Селекторы