43

Технология css теоретические сведения

1. Общие положения

   Каскадные таблицы стилей представляют собой простую технологию определения и присоединения стилей к документам HTML. Стиль, говоря житейским языком, - это все то, что определяет внешний вид документа HTML - при его отображении в окне браузера: шрифты и цвета заголовков разных уровней, шрифт и разрядка основного текста, задаваемого в тэге абзаца <P>, и т.д. Стиль задается по определенным правилам, о которых, собственно говоря, и пойдет речь, а таблица стилей - набор правил отображения, применяемых в документе, к которому присоединена соответствующая таблица стилей. Таблица стилей - это шаблон, который управляет форматированием тэгов HTML в Web-документе. Если вы работали с текстовым редактором Microsoft Word, то концепция таблицы стилей напомнит вам концепцию стилевых файлов этого редактора: изменить внешний вид документа HTML можно простым изменением присоединенных к нему стилей. Точно также изменить внешний вид документа HTML можно простым изменением присоединенной к нему таблицы стилей.

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

    Для разработки таблицы стилей достаточно немного ориентироваться в языке HTML и быть знакомым с базовой терминологией настольных издательских систем. Как отмечалось выше, таблица стилей представляет собой набор правил форматирования элементов HTML. Эти правила достаточно просты и легко запоминаемы. Например, если необходимо, чтобы в документе все заголовки первого уровня отображались синим цветом и шрифтом с кеглем (размером) 16 пунктов, то в таблице следует задать правило:

H1 {color: blue; font-size: 16pt}

    Любое правило каскадных таблиц стилей состоит из двух частей: селектора и определения. Селектором может быть любой тэг HTML, для которого определение задает, каким образом необходимо его форматировать. Само определение, в свою очередь, также состоит из двух частей: свойства и его значения, разделенных знаком двоеточия (:). Назначение свойства очевидно из его названия. В приведенном правиле селектором является элемент H1, а определение, записанное в фигурных скобках, задает значения двух свойств заголовка первого уровня: цвет шрифта (свойство color) определен как синий (значение blue) и размер шрифта (свойство font-size) определен в 16 пунктов (значение 16pt). В одном правиле можно задать несколько определений, разделенных символом точка с запятой (;), как это демонстрируется в приведенном примере.

    Созданная только что таблица стилей влияет на форматирование элемента определенного типа: заголовок первого уровня. Ее комбинация с другими таблицами стилей определяет окончательное представление документа при его просмотре в окне браузера.

    Замечание. Синтаксис правил каскадных таблиц стилей не чувствителен к регистру. Селекторы, свойства и их значения можно задавать как строчными (маленькими), так и прописными (большими) буквами, или в смешанном порядке. Однако каскадные таблицы стилей чувствительны к синтаксису задания правил и правильности названий свойств, значений и селекторов. Любая грамматическая ошибка приводит к тому, что правило пропускается анализатором браузера, и никакого предупреждающего сообщения не появляется!

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