Блок объявления стиля

Код, расположенный сразу за селектором, содержит все форматирующие команды, которые можно применить к этому селектору. Блок начинается с открывающей ({) и заканчивается закрывающей фигурной скобкой (}).

Объявление свойства

Между открывающей и закрывающей фигурными скобками блока объявления можно добавить одно или несколько определений или форматирующих команд. Каждое объявление имеет две части — свойство и значение свойства. Двоеточие отделяет имя свойства от его значения, и все объявление заканчивается точкой с запятой.

Свойство

CSS предлагает большой выбор команд форматирования, называемых свойствами. Свойство представляет собой слово или несколько написанных через дефис слов, определяющих конкретный стиль или стилевой эффект. У большинства свойств есть соответствующие, простые для понимания названия, такие как font-size, margin-top, background-color и т. д. (в переводе с английского: размер шрифта, верхний отступ, цвет фона). После имени свойства нужно добавить двоеточие, чтобы отделить его от значения.

Значение

Наконец, настал тот момент, когда можно присваивать значения CSS-свойствам: определяя фоновый цвет, например, синим, красным, фиолетовым, салатовым и т. д. Различные CSS-свойства требуют определенных типов значений — цвет (red или #FF0000), длина (18px, 200% или 5em), URL (images/background.gif), а также определенных ключевых слов (top, center, bottom).

Не обязательно описывать стиль на одной строке, как изображено на рисунке (рисунок 1.2). У стилей может быть множество форматирующих свойств, и есть возможность облегчить просмотр таблицы стилей путем разбивки объявлений на строки. Например, поместим селектор и открывающую скобку на одной строке, каждое объявление — далее на отдельных строках, а закрывающую фигурную скобку — отдельно на последней строке стиля. Это будет выглядеть следующим образом:

p {

color: red;

font-size: 1.5em;

}

вместо

p { color:red; font-size:1.5em; }

Любой браузер игнорирует символы пробела и табуляции. Так, полезно сделать отступ при перечислении свойств табуляцией или несколькими пробелами для явного отделения селектора от блока объявления. И к тому же один пробел между двоеточием и значением свойства, конечно, необязателен, но он обеспечивает дополнительную удобочитаемость стилей. Фактически можно добавить любое количество пробелов. Например, color:red, color: red и color: red — все варианты будут правильно работать.

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

Date: 2016-06-06; view: 668; Нарушение авторских прав