Очень хорошо описано назначение CSS, с примерами в статье на сайте intuit.ru [1]. CSS расшифровывается как Cascading Style Sheets. Применяются для регулирования отображения текста на html-странице (хотя может использоваться и для регулирования отображения нетекстовых элементов, что нежелательно). Таблицы стилей позволяют определить цвет и начертание текстового фрагмента, изменять эти параметры внутри текстового блока, выполнять выравнивание текстового блока относительно других блоков и компонентов страницы. Наличие подобных возможностей позволяет говорить о CSS как о средстве разделения логической структуры документа и формы его представления. Логическая структура документа определяется элементами HTML-разметки, в то время как форма представления каждого из этих элементов задается CSS-описателем элемента. Слово Cascading обозначает, что стили могут быть вложены друг в друга, и результирующий результат отображения теста будет зависеть от каждого элемента в цепочке вложенности.

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

< I>Отобразим текст курсивом< /I>

Отобразим текст курсивом

А теперь переопределим стиль отображения для элемента разметки:

< I STYLE="text-decoration:underline;
 font-style:normal;">
Отобразим текст курсивом, но курсива не будет из-за переопределенного стиля курсива. 
< /I>

Отобразим текст курсивом, но курсива не будет из-за переопределенного стиля курсива.

Существует 4 варианта использования CSS:

1. Переопределение стиля.

< H1 STYLE="font-weight:normal;
font-style:italic;
font-size:10pt;">
Заголовок первого уровня
< /H1>

Заголовок первого уровня

Атрибут style можно применить внутри любого элемента разметки. Например, мы можем через style определить ширину и выравнивание элемента hr (горизонтальное подчеркивание):

< HR STYLE="width:100px;">

2. Элемент STYLE.

Применение элемента STYLE — это основной способ внедрения каскадных таблиц стилей в ткань HTML-документа. Помимо управления отображением элементов разметки, элемент STYLE позволяет описывать стилевые свойства элементов, которые можно изменять при программировании на JavaScript. Элемент STYLE дает возможность определить стиль отображения для:

• стандартных элементов HTML-разметки;
• произвольных классов (селектор CLASS);
• НTML-объектов (селектор ID).

К сожалению, работа с селекторами в браузерах различных производителей может преподносить различного рода сюрпризы. Особенно это касается селектора ID. В данном случае мы будем рассматривать Microsoft как держателя патента на спецификацию CSS.

Стандартные элементы разметки описываются в элементе STYLE следующим образом:

< HEAD>
< STYLE>
p { color:darkred;text-align:justify;
   font-size:8pt; }< /STYLE>
< /HEAD>
< BODY>
...
< P>
Этот параграф мы используем как пример 
применения описания стиля для стандартного
элемента HTML-разметки.
< /P>
...
< /BODY>

Этот параграф мы используем как пример
применения описания стиля для стандартного
элемента HTML-разметки.

Теперь все параграфы документа будут отображаться стилем из элемента STYLE, если только стиль не будет каким-либо способом переопределен. В STYLE можно определить стиль любого элемента разметки.

3. Ссылка на внешнее описание.

Этот тип CSS используется, например, в NetObjects Fusion. Ссылка на описание стиля, расположенное за пределами документа, осуществляется при помощи элемента LINK, который размещают в элементе HEAD. Внешнее описание может представлять собой файл, содержащий описание стилей. Описание стилей в этом файле будет по синтаксису в точности совпадать с содержанием элемента STYLE. Ниже приведен пример ссылки на внешнее описание стилей:

< LINK TYPE="text/css" REL="stylesheet" HREF="http://intuit.ru/my_css.css">

Здесь важны значения атрибутов REL и TYPE. Атрибут REL должен иметь значение stylesheet. Type может принимать значения text/css или text/javascript. Второй тип описания стилей введен Netscape. Атрибут HREF задает универсальный локатор ресурса (URL) для внешнего файла описания стилей. Это может быть ссылка на файл с любым именем, а не только на файл с расширением *.css.

4. Импорт описания стилей.

Импорт описателей стилей в некотором смысле составляет конкуренцию представленному выше указанию на внешний описатель стиля. Импортировать стиль можно либо внутрь элемента STYLE, либо внутрь внешнего файла, который представляет собой описатель стиля. Оператор импорта стиля должен предшествовать всем прочим описателям стилей:

< STYLE>
@import:url(http://intuit.ru/style.css)
A { color:cyan;text-decoration:underline; }
< /STYLE>

Импортируемый стиль можно переопределить либо через описатель элемента в STYLE, либо через атрибут элемента STYLE.

[Ссылки]

1. Применение каскадных таблиц стилей (CSS) site:intuit.ru.