Веб-дизайн

Система CSS предоставляет в распоряжение дизайнеров набор обобщенных свойств (параметров оформления), таких как имя шрифта, цвет элемента и фона под ним, ширина любого из четырех окружающих элемент полей. Написание спецификации для HTML-документа заключается в присвоении значений нужным свойствам для тех или иных элементов (т. е. HTML-тегов), классов элементов (которые маркируются в HTML с помощью атрибута class у соответствующих тегов) и отдельных экземпляров тегов (идентифицируемых атрибутом id). Кроме того, можно варьировать свойства элементов, стоящих в том или ином контексте (например, увеличить расстояние между строками только для тех элементов Р, которые следуют сразу за элементом HI, — что было бы аналогом одной из особенностей верстки данной книги).

Слово «cascading» в названии системы CSS напоминает о том, что на вывод каждого тега в документе могут оказывать влияние сразу несколько стилевых спецификаций, образующих иерархическую систему. Например, поверх спецификаций, относящихся к конкретному документу, может действовать стилевой файл, общий для всех документов на сервере. Кроме того, пользователь броузера, поддерживающего CSS, может указать свои собственные свойства для тех или иных тегов. Конфликты, которые при этом возникают, разрешаются в пользу более частных, узких спецификаций: то, что указано для конкретного документа, берет верх над спецификациями для всего сервера, а параметры вывода тега в данном контексте имеют преимущество перед параметрами для того же тега «вообще», без учета контекста. В случае же конфликта спецификаций, заданных пользователем, с установками автора страницы побеждают последние, хотя пользователь все–таки может при желании изменить это правило на обратное. Само собой, CSS–свой–ства имеют также приоритет над принятыми в том или ином броузере стандартными параметрами оформления элементов HTML.

ВОЗМОЖНОСТИ

От версии системы CSS очень сильно зависит, чего с ее помощью можно добиться. Первая версия спецификации (CSS level 1 или попросту CSS1), ставшая официальным стандартом в конце 1996 года, по сути, лишь предлагала CSS-запись для тех параметров форматирования, которые и без того уже, будь то «законно» или «незаконно», были доступны HTML-документам в тогдашних графических броузерах. Свойства CSS1 включали в себя выбор шрифта, параметры форматирования текста, установку фонового цвета или изображения, ширину полей и еще несколько второстепенных параметров, в большинстве своем аналогичных атрибутам тех или иных тегов. Управлять положением элемента на странице можно было, лишь изменяя величину его полей и тем самым отодвигая его от границ предшествующего элемента или элемента–родителя.

Стандарт CSS2, законченный к январю 1998 года, существенно расширил возможности стилевых спецификаций сразу по нескольким направлениям. Прежде всего, его создатели вспомнили, что если содержимое у документа всегда одно и то же, то разнообразных представлений у него может быть сколько угодно, в том числе и в разных средах. В этой версии было введено понятие «типа среды» (media type), в зависимости от которого выбирается соответствующий набор свойств для тегов документа (пока, кроме графического, определен только один тип среды — звуковой, свойства которого позволяют регулировать громкость, темп произнесения текста и тембр голоса).

Для графических дизайнеров в этой версии также есть немало интересного. Из главных нововведений отметим механизм подбора шрифтов, позволяющий не только выбирать один из установленных в системе шрифтов, но и подшивать к документу передаваемый вместе с ним по сети шрифт и даже синтезировать шрифт по его описанию (стр. 221). Очень важна также возможность абсолютного позиционирования любого элемента относительно элемента–родителя или границ окна, в том числе с наложением элементов друг на друга и даже с возможностью «оживлять» их JavaScript–сценариями (стр. 64). Наконец, в этой версии впервые появились средства генерации содержимого, без которых невозможно создать сколько–нибудь сложные системы разметки. Самым частым примером такого генерируемого содержимого является автоматическая нумерация заголовков, поддержка которой введена в CSS2.