Предположим, вам нужно изменить цвет текста в HTML-документе с черного на синий. Вы помещаете его в пару тегов <FONT> и </FONT> следующего вида:

А теперь представим, что вы внесли определение внешнего вида текста в другое место документа:

Эта строка обозначает, что мы определили для текста, находящегося внутри тега <P> и помеченного стилевым классом bluetext, синий цвет шрифта. Такая конструкция HTML называется определением стиля или просто стилем.

В результате в HTML-тексте у нас остануться только теги логического форматирования текста:

Здесь мы пометили нужный текст с помощью атрибута class, присвоив ему значение bluetext. Атрибут class задает имя стилевого класса для тега, и его поддерживают все теги.

Вы можете переназначить цвета текста для всех тегов <P>. В этом случае мы не задаем имя стилевого класса:

Или вы можете задать форматирование для стилевого класса, не привязанного ни к какому тегу:

И теперь вы можете присваивать стилевой класс тексту, заключенному в любые теги:

текст Вы можете дать специальное форматирование тегу только в том случае, если он заключен внутрь другого тега:

И теперь:

Более того, вы можете встроить определение стиля прямо в тег:

Это достигается при помощи атрибута style, который также поддерживают все теги HTML.

И еще один способ привязать стиль к какому-либо тегу - использовать атрибут id, задающий уникальное имя элемента HTML.

Здесь мы задали размер шрифта 20 пунктов.

Вы можете задавать несколько атрибутов в определении стиля. В этом случае они разделяются точкой с запятой:

Определение стилей, вынесенные в заголовок HTML-документа, составляют таблицу стилей. Таблица стилей заключается в теги <STYLE> и </STYLE>:

Тег <STYLE> может содержать необязательный атрибут type, содержащий обязательное значение text/css.

Таблицу стилей можно вынести в отдельный файл и использовать сразу в нескольких документах. В этом случае в заголовке HTML-документа необходимо разместить тег <LINK>, указывающий на эту таблицу стилей: