Лістинг 2.18. Файл chap2\styles\cssdemo.htm

<!"DOCTYPE HTML PUBLIC -//W3C//DTD HTML 3.2//EN">

<HTML>

<HEAD>

<TITLE>Команда логічного форматування</ТITLE>

</HEAD>

<Н1>3аголовок перших рівні</Н1>

<Р>Звичайний текст

<Н2>3аголовок других рівні</Н2>

<Р CLASS=italic>Похилий текст

<Р CLASS=red> Текст червоного кольору

</BODY>

</HTML>

Параметри оператора <LINK> необхідно задавати, як указано в цьому прикладі. У параметрі HREF повинна бути вказаний адреса URL файла таблиці. Цей файл може знаходитися на будь-якому сервері WWW, а не на тому, де розміщений даний документ HTML

Як користуватися стилями з файла таблиці стилів? Дуже просто. Якщо в файлі визначені параметри для операторів мови HTML, призначених для оформлення тексту (наприклад, для операторів <Н1> або <Н2>, як в нашому прикладі), вказуються ці оператори без змін.

<Н1>Заголовок перших рівні</Н1>

<Р>Звичайний текст

<Н2>Заголовок других рівні</Н2>

Однак при визначенні стилю можливо не тільки перевизначити параметри форматування операторів, але і створити нові класи для цих операторів. Наприклад, нижче визначені класи italic і red для оператора <Р>:

P.itolic { font-style: italic }

P.red { color: red }

Для того щоб ввести в дію створені класи, ви повинні указати ім'я потрібного класу в параметрі CLASS оператора <Р> (або іншого оператора форматування тексту), як це показане нижче.

<Р СLАSS=italic>Похилий текст

<Р CLASS=red>Текст червоного кольору

Зовнішній вигляд документа, оформленого з використанням нашого файла таблиці стилів, показаний на мал. 2.16.

Неважко помітити, що заголовок першого рівня відображається з відступом від лівого краю, як це і було указано в стилі H1.

Заголовок другого рівня зображений з використанням шрифту з фіксованою шириною символів, оскільки у відповідному стилі було вказане сімейство шрифтів Courier.

Останні два параграфи документа відображаються відповідно з нахилом і з виділенням червоним кольором.

На жаль, навігатор Netscape Navigator проигнорировал створений файл таблиці шрифтів і відобразив документ з використанням стандартного оформлення.

Мал. 2.19 Зовнішній вигляд документа, оформленого з використанням файла таблиці стилів

2.9.1.6. Стилі в документі HTML

Ви можете вбудувати таблицю стилів безпосередньо в документ HTML, для чого треба використати оператор <STYLE>. Цей оператор застосовується в парі із закриваючим оператором </STYLE>. Між операторами <STYLE> і </STYLE> знаходиться таблиця стилів. У лістинг 2.19 приведений приклад документа HTML, в який вбудована таблиця стилів.

<13 14 151617 18 19 >

Дата добавления: 2015-04-19; просмотров: 631;