Внедрение таблицы стилей в документ
При внедрение таблицы стилей в документ правила, составляющие таблицу стилей, располагаются между тегами <STYLE TYPE= “text/css”> и </STYLE>, которые должны размещаться в разделе <HEAD> документа.
Пример:
<HTML>
<HEAD>
<STYLE type= “text/css”>
BODY {background-color: yellow}
H3 {letter-spacing: 1.5 em}
P {color: blue }
</STYLE>
</HEAD>
<BODY>
…
</BODY>
</HTML>
Где свойство letter-spacing влияет на расстояние между символами при отображении текста.
Импорт таблицы стилей в документ
Для импортирования таблицы стилей после тега <STYLE TYPE= “text/css”> следует задать значение свойства @import, которое определяет адрес файла таблицы стилей, импортируемой в документ.
Таблица стилей, которая импортируется для формирования документа, задается следующим образом:
<STYLE TYPE= “text/css”>
@import: URL(“URL-адрес”);
</STYLE>
Встраивание определений стилей
Встраивание определений стилей в тег влияет только на отображение элемента, определяемого данным тегом.
Пример:
<P STYLE= “color: red; text-align: left”>Текст красного цвета, выровненный по левому краю </P>
<P STYLE= “color: blue; text-align: right”> Текст синего цвета, выровненный по правому краю </P>
Определение и использование классов
В DHTML можно задать разные правила форматирования для одного элемента. В этом случае в теге <style> определяются классы. Имя класса определяется пользователем, указывается после имени тега и отделяется от него точкой. Например, p.elleft.
В теле документа для каждого из заголовков и абзацев можно задать класс, к которому данный элемент относится. Для этой цели используется параметр class.
Пример:
<HEAD>
<STYLE>
p.elleft {color: red; text-align: left}
p.elcenter { color: green; text-align: center}
p.elright {color: blue; text-align: right}
</STYLE>
</HEAD>
<BODY>
<P class=elleft> Текст красного цвета, выровненный по левому краю</P>
<P class=elcenter> Текст зеленого цвета, выровненный по центру</P>
<P class=elright> Текст синего цвета, выровненный по центру</P>
</BODY>
Класс для всех элементов страницы
Если класс должен применяться ко всем элементам документа, то при определении класса тег не задается, а описание начинается с точки.
<STYLE>
.elred {color: red}
.elblue {color: blue}
</STYLE>
Классы elred и elblue можно применять к любым элементам на странице.