Учебник HTML

Учебник CSS >>Группирование стилей, назначение классов и псевдоклассов

• Группирование стилей
• Назначение классов
• Назначение псевдоклассов

Группирование стилей

Существуют дополнительные методы, которые расширяют функциональные возможности таблиц стилей. Стили можно сгруппировать, что позволяет уменьшить количество необходимых атрибутов и аргументов, путем создания логических групп. Группирование таблиц стилей может происходить по одинаковым тэгам, или по атрибутам одного семейства. Порядок атрибутов играет важную роль: насыщенность шрифта и стиль начертания должны находиться перед остальными атрибутами - кегль должен быть задан до межстрочного интервала, и только потом в строку можно добавить дополнительную информацию. В случае группирования атрибутов - между ними запятые не ставятся, исключение составляет атрибут семейства шрифта, перед ним ставится запятая.

Пример группирования по тэгам:
До группирования:

После группирования:

Пример группирования по атрибутам одного семейства:
До группирования:

После группирования

Назначение классов

Для того, чтобы сделать работу более универсальной, можно создать несколько вариантов - классов свойств стилей и применять их к элементам поочередно. Сгруппировав стили по свойствам, необходимо дать им названия ввиде расширения к элементу.
Синтаксис:
H1.left {text-align: left}
H1.right {text-align: right}
Далее в документе указывается либо <H1 class=left>, либо <H1 class=right>

Аналогично можно создать универсальный класс и применять его потом к различным элементам:
Синтаксис:

Назначение псевдоклассов

Псевдоклассы позволяют задавать стиль элемента по его характеристикам, которые не являются именем, атрибутом или содержимым. Элемент может приобрести псевдокласс или лишиться его во время работы пользователя с документом.

• A:link - не просмотренные ссылки
• A:visited - просмотренные ссылки
• A:hover - выбранная, но не активизированная ссылка
• A:active - активизированная ссылка