Оскільки в XML ви створюєте свої власні елементи, браузер не має вбудованих засобів, що дозволяють визначити, як їх правильно відображувати. Створення каскадних таблиць стилів і зв’язування їх з вашим XML-документом – це один із способів повідомити браузеру, як відображувати кожен з елементів документа. XML-документ із зв'язаною таблицею каскадних стилів може бути відкритий безпосередньо в браузері. Вам немає необхідності використовувати HTML-сторінку для доступу і відображення даних (як це має місце в інших методах відображення XML).
Зберігання інструкцій щодо відображення в таблиці стилів окремо від самого XML-документа підвищує гнучкість XML-документа і полегшує роботу з ним. Ви можете, наприклад, швидко адаптувати один XML-документ до різних умов відображення (різним браузерам, додаткам, контекстним ситуаціям, периферійним пристроям і так далі) простим приєднанням відповідної таблиці стилів, без необхідності реструктурувати сам документ. Ви також можете швидко відновити формат для групи схожих XML-документів за допомогою внесення змін у приєднаній до цих документів таблиці стилів, не відкриваючи і не редагуючи кожен з документів.
Використання таблиці стилів напевно є найпростішим методом відображення XML-документа. Сучасні Web-браузери забезпечують високий рівень підтримки каскадних таблиць стилів, тоді як інші методи відображення XML все ще знаходяться у стадії розвитку, і браузери тільки починають їх підтримувати.
Так, у порівнянні з іншими методами відображення XML, каскадні таблиці стилів мають ряд обмежень. Хоча таблиця каскадних стилів надає достатньо високий рівень керованості способами, якими браузер форматує вміст елементів в XML-документах, вона не дає можливості модифікувати або реорганізовувати його вміст. Вона також не дозволяє вам здійснювати доступ до атрибутів, примітивів, інструкцій з обробки і іншим компонентам XML – а також не дає можливості обробляти інформацію, яку ці компоненти містять.
Далі ви познайомитеся зі складнішими, але і гнучкішими способами відображення XML-документів.
Основні етапи при використанні каскадних таблиць стилів
Наведемо два основні етапи при використанні таблиці каскадних стилів для відображення XML-документа:
Створення файлу таблиці стилів.
Пов'язання таблиці стилів з XML-документом.
Крок перший: створення файлу таблиці стилів
Таблиця каскадних стилів є текстовим файлом, як правило, з розширенням *.css, який містить набір правил, що повідомляють браузеру, яким чином форматувати і відображувати елементи в певному XML-документі. Як і XML-документ, ви можете створювати таблицю стилів за допомогою текстового редактора.
Розглянемо приклад простої таблиці каскадних стилів example_19.css.
BOOK
{display:block;
margin-top:12pt;
font-size:10pt}
TITLE
{font-style:italic}
AUTHOR
{font-weight:bold}
Ця таблиця стилів призначена для приєднання до XML-документа.
Таблиця стилів складається з одного або декількох правил (інколи їх називають набором правил). Правило містить інформацію про відображення певного типу елемента в XML-документі.
Селектором є ім'я типу елемента, до якого відноситься інформація про відображення.
За селектором іде блок оголошень, який обмежується фігурними дужками ({) і містить одне або декілька оголошень, що розділяються крапкою з комою.
Кожне оголошення задає установку певної властивості, такої як розмір шрифту, який буде використаний для відображення елемента. Оголошення складається з властивості, вслід за якою йде двокрапка, після якої йде значення для даної властивості. Наприклад, наступне оголошення встановлює для властивості font-size (розмір шрифту) значення 10pt (10 пунктів).
Таблиця стилів може також містити коментарі. Коментарі в таблиці стилів починаються з символів косої межі і зірочки (/*) і закінчуються символами зірочки і косої межі (*/). Між цими парами символів-обмежувачів ви можете помістити будь-який текст за вашим бажанням. Коли браузер зчитує таблицю стилів для форматування документа, він ігнорує цей текст. Ви можете використовувати коментар для пояснень, вказівки призначення і дії таблиці стилів.
Ви також можете використовувати коментарі в процесі розроблення таблиці стилів, щоб тимчасово відключити правило або його частку. Наприклад, якщо ви хочете подивитися, який вигляд будуть мати елементи BOOK без верхнього відбиття, то можете тимчасово додати символи коментарів у таке правило:
BOOK
{display:block;
/* margin-top:12pt; */
font-size:10pt}.
Примітка. Порожні символи (пропуски, табуляція, пропуск рядка) відділяють різні компоненти CSS такі як індивідуальні оголошення в блоці оголошень. Спосіб використання пропусків у даному курсі є лише одна з можливостей. Ви можете використовувати пропуски будь-яким способом, щоб краще організувати вміст і додати велику ясність вашим власним таблицям стилів. Наприклад, ви можете помістити всі оголошення, що відносяться до правила, в один рядок, замість того, щоб розміщувати кожне з них на окремому рядку, як це зроблено в прикладах.
Даний приклад таблиці стилів містить такі оголошення:
display:block. Вміщує порожній рядок перед і після тексту елемента;
margin-top:12pt. Додає верхнє поле висотою в 12 пт до тексту елемента;
font-size:10pt. Встановлює розмір шрифту, що використовується для відображення тексту елемента, в 10 пунктів;
font-style:italic. Відображує текст елемента курсивом;
font-weight:bold. Відображує текст елемента напівжирним шрифтом.
На рисунку 9 показано як браузер відображує XML-документ, який використовує дану таблицю стилів відповідно до інструкцій, що містяться в цих оголошеннях.
Р
Рисунок 17 – Відображення xml-даних за допомогою каскадних таблиць стилів
Набір властивостей, що використовувався в таблицях каскадних стилів, схожий на набір властивостей, які ви можете застосовувати в текстовому процесорі.