CSS. Каскадные таблицы стилей. Подробное руководство.Символ-Плюс 2008

Печать

Может показаться, что написать это правило намного сложнее, чем HTML, но представьте, что на странице расположена дюжина элементов h2, которые должны выглядеть так же, как hi. Сколько разметки потребуется для этих 12 элементов h2? Много, А применяя CSS, достаточно сделать следующее:

hi, h2 {color:maroon; font; italic 2em Times, serif;

text-decoration:underline; background:yellow;}

Теперь стили применены и к элементам hi, и к элементам h2, а понадобилось для этого всего лишь три дополнительных нажатия на клавиши.

Если вы хотите изменить вид элементов hi и h2, преимущества CSS даже еще более ощутимы. Представьте, сколько времени понадобилось бы, чтобы изменить разметку HTML для элементов hi и h2, по сравнению с внесением следующих изменений в предыдущие стили:

hi, h2 {color:navy; font:bold 2em Helvetica, sans-serif;

text-decoration:underline overline; background:silver;}

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

Кроме того, большинство правил CSS сосредоточиваются в документе в одном месте. Можно распределить их по всему документу, группируя в ассоциированные стили или отдельные элементы, но как правило, намного эффективнее поместить все стили в одну таблицу стилей. Это позволяет разрабатывать (или изменять) внешний вид всего документа в одном месте*

Применение стилей к нескольким страницам

Но есть и еще кое-что! Можно не только централизовать всю информацию о стилях страницы в одном месте, но и создать таблицу стилей, которая может применяться ко многим страницам. Это реализуется путем сохранения таблицы стилей в отдельном документе, который затем импортируется любой использующей его страницей документа. Эта возможность позволит быстро создавать единообразный внешний вид всего веб-сайта. Для этого достаточно привязать одну таблицу стилей ко всем документам веб-сайта. Затем, если вам когда-нибудь захочется изменить внешний вид страниц сайта, надо будет лишь отредактировать один файл, и внесенные изменения распространятся на весь сервер автоматически!

Рассмотрим сайт, в котором все заголовки выделены серым шрифтом на белом фоне. Этот цвет они получают из таблицы стилей, которая гласит:

hi, h2, h3, h4, h5, h6 {color:gray; background:white:}

Предположим, этот сайт состоит из 700 стриннц, каждая из которых использует таблицу стилей, оговаривающую» что мголовки должны