Сравните следующие два документа:

<html>
<head>
<title>
Документ, написанный с
использованием CSS
</title>
<style type="text/css">
h3 { color: green;
     font-style: italic}
</style>
</head>
<body>
<h3>Заголовок 3-го уровня</h3>
...текст документа...
...текст документа...

<h3>Заголовок 3-го уровня</h3>
...текст документа...
...текст документа...
</body>
</html>
<html>
<head>
<title>
Документ, написанный без
использования CSS
</title>
</head>
<body>
<font color=green>
<h3>
<i>Заголовок 3-го уровня</i>

</h3>
</font>
...текст документа...
...текст документа...
<font color=green>
<h3>
<i>Заголовок 3-го уровня</i>
</h3>
</font>

...текст документа...
...текст документа...
</body>
</html>

Заметьте, что в примере с помощью возможностей CSS оптимизирован только один HTML-элемент, а как упростился документ.

Умелое использование возможностей CSS2 (обособленно или в сочетании с DHTML) позволяет реализовать оригинальные визуальные эффекты, описание которых произведено ниже.

Браузер, как и в случае с HTML-элементами, игнорирует непонятные ему правила, потому никаких конфликтных ситуаций из-за использования каскадных таблиц стилей возникать не может.

Каскадные таблицы стилей могут располагаться либо в заголовке HTML-документа (в содержимом элемента <style>), либо во внешнем файле с расширением .css. В этом случае подключение таблицы стилей осуществляется элементом заголовка link. Использование внешних таблиц стилей особенно актуально для многостраничных сайтов, все страницы которых должны быть выдержаны в одном дизайнерском решении. Поэтому, вместо того, чтобы в коде каждой страницы писать одинаковые стилевые настройки, достаточно написать их один раз, поместить во внешний css-файл и подключить ко всем страницам сайта.

Таблицы стилей называются каскадными, потому что при подключении к одному HTML-документу нескольких стилевых таблиц, они, в соответствии со своим приоритетом, выстраиваются в каскад. По этому каскаду и прогоняется документ. При этом правила с более высоким приоритетом переопределяют идентичные правила с более низким приоритетом. Подробнее порядок каскадирования и наследования будет рассмотрен в разделе "Каскады и наследование".