Тема 5. Таблицы каскадных стилей

В данном разделе будет описан один из первых методов отображения XML-документов в браузере: таблицы каскадных стилей (CSS). Таблица каскадных стилей представляет собой файл, который содержит инструкции для форматирования элементов в XML-документе.

Поскольку в XML вы создаете свои собственные элементы, браузер не имеет встроенных средств, позволяющих определить, как их правильно отобразить. Создание таблицы каскадных стилей и связывание ее с XML-документом - это один из способов сообщить браузеру, как отображать каждый из элементов документа. XML-документ со связанной таблицей каскадных стилей может быть открыт непосредственно в браузере. В связи с этим нет необходимости использовать HTML-страницу для доступа и отображения данных (как это имеет место в других методах отображения XML, о которых будет рассказано далее).

Хранение инструкций по отображению в таблице стилей отдельно от самого XML-документа повышает гибкость XML-документа и облегчает работу с ним. Можно, например, быстро адаптировать один XML-документ к различным условиям отображения (различным браузерам, приложениям, контекстным ситуациям, периферийным устройствам и т.д.) простым присоединением соответствующей таблицы стилей, без необходимости реструктурировать сам документ. Также можно быстро обновить формат для группы сходных XML-документов, внеся изменения в присоединенную к этим документам таблицу стилей, не открывая и не редактируя каждый из документов.

Использование таблицы стилей, наверное, является самым простым методом отображения XML-документа. Язык CSS уже знаком многим Web-дизайнерам, поскольку именно он в настоящее время используется для HTML-страниц. Кроме того, современные Web-браузеры обеспечивают высокий уровень поддержки таблиц каскадных стилей, в то время как другие методы отображения XML все еще находятся в стадии развития, и браузеры только начинают их поддерживать. Тем не менее, по сравнению с другими методами отображения XML, о которых будет рассказано далее, таблицы каскадных стилей имеют ряд ограничений. Хотя таблица каскадных стилей позволяет управлять способами форматирования содержимого элементов в XML-документах, она не дает возможности модифицировать или реорганизовывать само содержимое. Она также не позволяет осуществлять доступ к атрибутам, примитивам, инструкциям по обработке и другим компонентам XML и не дает возможности обрабатывать информацию, которую эти компоненты содержат.

5.1. Создание файла таблицы стилей

Таблица каскадных стилей представляет собой текстовый файл, обычно с расширением .css, который содержит набор правил, сообщающих браузеру, каким образом форматировать и отображать элементы в определенном XML-документе. Как и XML-документ, таблицу стилей можно создавать с помощью текстового редактора.

Ниже представлен листинг, который содержит пример простой таблицы каскадных стилей.

/* Имя файла: Inventory01 .сss */

BOOK

{

display: block;

margin-top: 12pt;

font-size: 10pt

}

TITLE

{

font-style: italic

}

AUTHOR

{

font-weight: bold

}

Эта таблица стилей предназначена для присоединения к XML-документу, представленному выше в листинге 1.2

Таблица стилей состоит из одного или нескольких правил (иногда их называют набором правил). Правило содержит информацию по отображению определенного типа элемента в XML-документе. На рисунке ниже представлено правило для элементов BOOK с указанием его составных частей.

Селектор представляет собой имя типа элемента, к которому относится информация по отображению.

За селектором следует блок объявлений, который ограничивается фигурными скобками ({}) и содержит одно или несколько объявлений, разделяемых точкой с запятой.

Каждое объявление задает установку определенного свойства, такого как размер шрифта, который будет использован для отображения элемента. Объявление состоит из свойства, вслед за которым идет двоеточие, после которого следует значение для данного свойства. Например, следующее объявление устанавливает для свойства font-Size (размер шрифта) значение 10pt(10 пунктов) (см. следующий рисунок).

Таблица стилей может также содержать комментарии. Комментарии в таблице стилей начинаются с символов косой черты и звездочки (/*) и заканчиваются символами звездочки и косой черты (*/). Между этими парами символов-ограничителей можно поместить любой текст. Когда браузер прочитывает таблицу стилей для форматирования документа, он игнорирует этот текст. Комментарий можно использовать для пояснений, указания назначения и действия таблицы стилей. В качестве примера можно привести комментарий в начале таблицы стилей из Листинга 1.3:

/* Имя файла: Inventory01.сss */

Комментарии можно использовать также в процессе разработки таблицы стилей, чтобы временно отключить правило или его часть. Например,

BOOK

{display: block;

/* margin-top: 12pt; */

font-size: 10pt}

Пример таблицы стилей, представленной в Листинге 1.3, содержит следующие объявления:

• display: block. Помещает пустую строку перед и после текста элемента; (Эта установка имеет и другие назначения)

• margin-top: 12pt. Добавляет верхнее поле (отбивку) высотой в 12 пунктов к тексту элемента;

• font-size: 10pt. Устанавливает размер шрифта, используемого для отображения текста элемента, в 10 пунктов;

• font-style: italic. Отображает текст элемента курсивом;

• font-weight: bold. Отображает текст элемента полужирным.

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