Каскадные таблицы стилей
Одной из основных особенностей таблиц стилей является каскадность. Она означает, что при обработке стилей используется специальный механизм каскадирования. Для одного документа могут быть заданы различные правила. Один набор правил может определяться разработчиком документа, другие правила могут быть заданы пользователем. Кроме того, в каждом браузере имеется набор правил, используемых по умолчанию; они используются, если какое-либо из свойств явно не определено. Средства каскадирования собирают и объединяют различные правила, а также разрешают возникающие при этом конфликты.
Свойство каскадности тесно связано со способом подключения стилей к HTML-документу, которое возможно осуществить тремя способами: inline-описание, описание в секции заголовка и использование внешнего файла.
Самый простой способ - это, так называемое, inline-описание или описание, встроенное в тег. При помощи дополнительного атрибута STYLE можно определить нужные стилевые параметры в любом теге. Основной недостаток этого способа в том, что определение стиля действует лишь в пределах одного тега. Представьте, насколько вырастет размер файла, и насколько неудобно будет его исправлять, если указывать стиль у каждого тега. Этот способ не слишком отличается, к примеру, от прямого описания внешнего вида при помощи тега <FONT>.
Пример
<P STYLE="color:red; text-align:center;">Этот параграф переопределен стилем</P>
Гораздо удобнее заранее определить все нужные стили оформления и впоследствии просто применять их к соответствующим тегам, т. е. воспользоваться способом описания стилей в секции заголовка. Именно этим способом мы пользовались в примерах, рассматривающих форматирование абзаца и оформление интервью. Действие таблицы стилей, подключенной таким образом, распространяется на весь HTML-документ.
И наконец, третий способ, - вынесение описания стилей во внешний файл (внешнюю таблицу стилей). Для этого нужно все описание стилей поместить в отдельный файл с расширением .css.
В раздел HEAD документа включить строку, аналогичную следующей, где атрибут HREF содержит имя файла со стилями:
<LINK REL="STYLESHEET" TYPE="text/css" HREF="list.css">
Диапазон воздействия таблицы в этом случае простирается на все файлы, в которые включено такое описание. Если потребуется изменить внешний вид группы документов, то будет достаточно откорректировать лишь один стилевой файл. Сравните этот способ с предыдущими: в одном из них придется менять описание стилей в каждом документе, а в другом - даже в каждом теге.
На практике приходится пользоваться всеми тремя способами, и здесь в игру вступает "каскадность" стилей, позволяющая переопределять стили. Приведенный выше список способов подключения таблиц стилей соответствует порядку переопределения: вышерасположенный способ может переопределять нижерасположенный.
Например, пусть во внешнем стилевом файле определено, что текст в теге <P> должен выводится шрифтом высотой 10 пунктов. Если при этом в разделе HEAD документа переопределить тег <P>, указав, что текст должен отображаться шрифтом в 12 пунктов, то он будет выведен именно таким кеглем - стиль, расположенный в заголовке документа, переопределит стиль внешнего файла.
В целом, браузер расставляет приоритеты таблиц стилей следующим образом:
|
