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

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

<HTML>

<HEAD>

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

<LINK REL=STYLESHEET HREF="ctyles.css" TYPE="text/css">

</HEAD>

<BODY BGCOLOR=#FFFFFR>

<Н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, в який вбудована таблиця стилів.

 








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


Поиск по сайту:

При помощи поиска вы сможете найти нужную вам информацию.

Поделитесь с друзьями:

Если вам перенёс пользу информационный материал, или помог в учебе – поделитесь этим сайтом с друзьями и знакомыми.
helpiks.org - Хелпикс.Орг - 2014-2024 год. Материал сайта представляется для ознакомительного и учебного использования. | Поддержка
Генерация страницы за: 0.005 сек.