В первой статье я преднамеренно не описывал дескрипторы и атрибуты касающиеся стилевой разметки, поскольку в стандарте HTML 4.01 они относятся к числу не рекомендуемых к применению (в последующих версиях стандарта могут быть отнесены к устаревшим и вышедшим из употребления). Вместо них рекомендуется применять аппарат стилевого оформления (Style sheets).
С помощью таблиц стилей решаются следующие вопросы стилевой разметки:
Одно из фундаментальных средств CSS — каскад стилей. Стили могут быть указаны
- в рамках элемента;
- документа;
- внешнего документа.
В действительности, для любого заданного экземпляра документа стили могут существовать во всех этих трех указанных местах. Подобная гибкость по отношению к расположению стиля обеспечивает модульность и гибкость проектирования документов. Стиль, определенный на уровне элемента, подавляет стиль, определенный на уровне всего документа, который, в свою очередь, подавляет любые стили, определенные во внешних файлах таблиц каскадных стилей.
Каскадная таблица стилей — это текстовый файл, обычно сохраняемый с расширением .сss
. Он создается с помощью обычного текстового редактора или с помощью редактора со встроенной поддержкой каскадных таблиц стилей CSS. Файл содержит правила для синтаксического анализатора браузера по отображению данных. Эти правила состоят из селекторов и объявлений, которые определяют, каким образом данные должны быть представлены пользователю. Селекторы обычно ссылаются на отдельные HTML-элементы, а объявления определяют, каким образом тот или иной выбранный элемент отображается. Объявления содержат пары свойство-значение. Каждое свойство назначает определенное значение. Синтаксис правила CSS приведен ниже:
Селектор {свойство:значение; свойство:значение;...}
HTML-документ связывается с внешней таблицей стилей посредством дескриптора <LINK>
:
<link
rel="stylesheet" type="text/css" href=URI>
Внутренняя таблица стилей обычно приводится в заголовке документа посредством дескриптора <STYLE>
:
<style type="text/css">
<!--
Селектор1 {свойство: значение}
Селектор2 {свойство: значение}
Селектор3 {свойство: значение}
...
-->
</style>
В рамках HTML-элемента его стиль определяется атрибутом style
:
<ДЕСКРИПТОР style
="свойство:значение; свойство:значение;...">