14. Стилевые таблицы

14.4. Каскадные стилевые таблицы

Языки каскадных стилевых таблиц, таких как CSS, позволяют смешивать стилевую информацию от нескольких источников вместе. Хотя, не все языки стилевых таблиц поддерживают каскадирование. Для определения каскада авторы определяют последовательность элементов LINK и/или STYLE. Стилевая информация каскадируется в порядке появления элементов в разделе HEAD.

Обратите внимание. Эта спецификация не определяет, как стилевые таблицы образуют каскады от различных стилевых языков. Авторам следует избегать смешивания языков стилевых таблиц.

В следующем примере мы определяем две альтернативные стилевые таблицы, названные "compact". Если пользователь выбирает стиль "compact", то устройство вывода должно применять обе стилевые таблицы, а также постоянную стилевую таблицу "common.css". Если пользователь выбирает стиль "big print", то только альтернативная стилевая таблица "bigprint.css" и постоянная "common.css" будут приниматься.

<LINK rel="alternate stylesheet" title="compact" href="small-base.css" type="text/css">
<LINK rel="alternate stylesheet" title="compact" href="small-extras.css" type="text/css">
<LINK rel="alternate stylesheet" title="big print" href="bigprint.css" type="text/css">
<LINK rel="stylesheet" href="common.css" type="text/css">

Ниже приводится пример каскада, который включает оба элемента LINK и STYLE.

<LINK rel="stylesheet" href="corporate.css" type="text/css">
<LINK rel="stylesheet" href="techreport.css" type="text/css">
<STYLE type="text/css">
    p.special { color: rgb(230, 100, 180) }
</STYLE>

14.4.1 Последовательности (каскады), зависимые от медиа

Каскад может включать стилевые таблицы, доступные различным медиа. Оба элемента, LINK и STYLE, могут использоваться с атрибутом media. Устройство вывода отвечает за отбрасывание тех стилевых таблиц, которые не применяются для текущего медиа-устройства.

В следующем примере, мы определяем каскад, где стилевая таблица "corporate" предоставлена в нескольких версиях: одна пригодна для печати, вторая – для использования на экране и третья – для речевых браузеров (когда читают сообщения электронной почты в машине). Стилевая таблица "techreport" применяется для всех медиа. Правило для цвета, определенное элементом STYLE, используется для печати и экрана, но не для аудио вывода.

<LINK rel="stylesheet" media="aural" href="corporate-aural.css" type="text/css">
<LINK rel="stylesheet" media="screen" href="corporate-screen.css" type="text/css">
<LINK rel="stylesheet" media="print" href="corporate-print.css" type="text/css">
<LINK rel="stylesheet" href="techreport.css" type="text/css">
<STYLE media="screen, print" type="text/css">
    p.special { color: rgb(230, 100, 180) }
</STYLE>

14.4.2 Наследование и каскадирование

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

Каскадный механизм используется тогда, когда все число стилевых правил применяются напрямую к элементу. Механизм позволяет устройству вывода сортировать правила, определяя, какое правило применять. Если правило не может быть обнаружено, то следующий шаг зависит от того, может ли стилевое правило наследоваться или нет. Не все свойства могут наследоваться. Для таких свойств язык стилевых таблиц предоставляет значения по умолчанию для использования, когда нет явных правил для частного элемента.

Если свойство может наследоваться, то устройство вывода исследует ближайший включающий элемент для понимания, можно ли применить данное правило. Этот процесс продолжается до тех пор, пока не будет обнаружено применимое правило. Этот механизм позволяет стилевым таблицам определяться компактнее. Например, авторы могут определить семейство шрифтов для всех элементов внутри BODY с помощью единственного правила, которое применяется для элемента BODY.