В синтаксисе языка CSS селекторы играют роль указателя совокупности форматируемых данным стилем элементов документа. В качестве селектора могут быть:
Селектор типа элемента - задаёт стиль всякому элементу данного типа. Обозначается ключевым словом дескриптора соответствующего элемента. Универсальный селектор "*" позволяет задать стиль для каждого элемента документа, независимо от его типа;
Селектор класса и псевдокласса - для стиля подмножества элементов одного типа или нескольких различных.
Селектор класса обозначается произвольным именем с префиксом ".". К кокретному любому элементу стиль можно применить, указав имя класса в атрибуте class <ДЕСКРИПТОР class="имя"> Псевдоклассы имеют свои предопределённые имена. С помощью такого селектора можно выделить элементы документа, имеющие определённый динамический статус. Обозначается ДЕСКРИПТОР:псевдокласс;
Таблица 2.1. Специальные псевдоклассы
Имя
Описание
link
Адресная ссылка <A>, по которой ещё не выполнялся переход
visited
Адресная ссылка <A>, по которой уже выполнялся переход
active
Элемент, активизированный щелчком мыши
hover
Элемент с курсором мыши (без щелчка)
focus
Элемент в фокусе (готовый принять ввод с клавиатуры)
Селектор атрибута - для стиля эелементов с определённым атрибутом (или определённым его значением. Обозначается ДЕСКРИПТОР[атрибут=значение];
Селектор идентификатора - для стиля отдельного элемента с указанным идентификатором. Обозначается ДЕСКРИПТОР#идентификатор
Можно использовать простые селекторы, именем одного тега, но можно строить и более сложные селекторы:
A> B Такой селектор определяет элемент вида В, который является дочерним для А.
A> B:first-childЭтот селектор определяет первый дочерний элемент.
А1+А2 Такой селектор отбирает два соседних элемента одного уровня.
А1, А2 ... Аn Группирование селекторов позволяет сократить описание стилей в случае, если несколько элементов должны иметь одинаковый стиль.
A:first-line позволяет задать особый формат первой строки текстового содержания элемента.
A:first-letter позволяет задать особый формат первого символа.
A:before позволяет вставить генерируемый текст перед содержимым элемента (например, маркер).
A:after позволяет вставить генерируемый текст после содержимого элемента.