Материал: Лекція 4 Форматування тексту. Гіперпосилання та списки
<LI><FONT COLOR=orange>Оранжевий</FONT></LI>
<LI><FONT COLOR=yellow>Жoвтий</FONT></LI>
<LI><FONT COLOR=green>Зелений</FONT></LI>
<LI><FONT COLOR=lightblue>Блакитний</FONT></LI>
<LI><FONT COLOR=blue>Синій</FONT></LI>
<LI><FONT COLOR=darkmagenta>Фіолетовий</FONT></LI> </OL>
</BODY> </HTML>
Ha мал. 3 показаний вигляд цього документа у вікні браузера Internet Explorer.
мал. 3
Нумерований
список
Зверніть увагу на те, що за допомогою тегу < B A S E F O N T > для всього документа призначено розмір шрифту 6, а за допомогою тегів <FONT> визначено колір шрифту для кожного елемента списку.
-
Ненумеровані списки:
<UL|> ... </UL>
Текст, розташований між мітками <UL|> і </UL>, сприймається як ненумерований список. Кожен новий елемент списку слід починати з мітки <LI|>. У мітки <LI|> немає парної закриваючої мітки.
type| = інформація про стиль — Цей атрибут встановлює стиль елементу списку. Доступні в даний час значення призначені для візуальних агентів користувачів. Можливі значення описані у таблиці (включаючи інформацію про регістр).
Графічні агенти користувач можуть генерувати їх як:
-
для значення "disc|"
○ для значення "circle|"
■ для значення "square|"
value| = число — Цей атрибут встановлює номер поточного елементу списку. Пам'ятаєте, що, хоча значенням атрибуту є ціле число, відповідна мітка може бути нечислова.
Compact| — Якщо цей логічний атрибут встановлений, він повідомляє візуальних агентів користувачів про те, що генерувати список потрібно компактніше. Інтерпретація цього атрибуту залежить від агента користувача.
Приклад 3 . Маркований список, в якому для позначення елементів використовують коло
<HTML>
<TITLE>Райдуга</TITLE> <BODY>
<BASEFONT SIZE=6> <UL ТУРЕ=сігсlе>
<LI><FONT COLOR=red>Червоний</FONT></LI>
<LI><FONT COLOR=orange>Оранжевий</FONT></LI>
<LI><FONT COLOR=yellow>Жовтий</FONT></LI> <LI><FONT COLOR=green>Зелений</FONT></LI> <LI><FONT COLOR=lightblue>Блакитний</FONT></LI>
<LI><FONT COLOR=blue>Синій</FONT></LI>
<LI><FONT COLOR=darkmagenta>Фioлeтoвий</FONT></LI> </UL>
</BODY>
</HTML>
Ha мал. 4 показаний вигляд цього документа у вікні браузера Internet Explorer.
Мал. 4.
Маркований список
-
Списки визначень: <DL|> ... </DL>
Список визначень (definition list) порівняно з маркованим або нумерованим має дещо складнішу будову. Кожен елемент такого списку складається з двох частин: терміна та його визначення. У такий спосіб можуть бути оформлені словники та термінологічні довідники. Однак цей тип списку використовують рідко, і тому описувати його докладніше не будемо.
Список визначень декілька відрізняється від інших видів списків. Замість міток <LI|> в списках визначень використовуються мітки <DT|> (від англійського definition| term| — визначуваний термін) і <DD|> (від англійського definition| definition| — визначення визначення). Розберемо це на прикладі. Нехай, у нас є наступний фрагмент HTML-текста|:
<DL|>
<DT>HTML|
<DD>Термин| HTML| (HyperText| Markup| Language|) означає 'мову
маркіровки гіпертекстів'. Першу версію HTML| розробив співробітник
Європейській лабораторії фізики елементарних частинок Тім Бернерс-лі.
<DT>HTML-документ|
<DD>Текстовий| файл з розширенням *.htm (Unix-системи| можуть
містити файли з розширенням *.html).
</DL>
Цей фрагмент буде виведений на екран таким чином:
Точно так, як і мітки <LI|>, мітки <DT|> і <DD|> не мають парних закриваючих міток. Якщо визначувані терміни достатньо короткі, можна використовувати модифіковану відкриваючу мітку <DL| COMPACT|>. Наприклад, ось такий фрагмент HTML-текста|:
|
<DL| COMPACT|> <DT>А| <DD>Первая| буква алфавіту <DT>Б| <DD>Вторая| буква алфавіту <DT>В| <DD>Третья| буква алфавіту </DL> |
-
Вкладені списки
Елемент будь-якого списку може містити в собі цілий список будь-якого вигляду. Число рівнів вкладеності в принципі не обмежене, проте зловживати вкладеними списками все ж таки не слідує. Вкладені списки дуже зручні при підготовці різного роду планів і змісту. Наші знання про списки можна коротко звести в приклад:
<html|>
<head|>
<title>Приклад 6</title>
</head>
<body|>
<H1>HTML| підтримує декілька видів списків </H1>
<DL|>
<DT>Ненумеровані| списки
<DD>Елементи ненумерованого списку виділяються спеціальним
символом і відступом зліва:
<UL|>
<LI>Елемент 1
<LI>Елемент| 2
<LI>Елемент| 3
</UL>
<DT>Нумеровані| списки
<DD>Елементи| нумерованого списку виділяються відступом зліва, а
також нумерацією:
<OL|>
<LI>Елемент| 1
<LI>Елемент| 2
<LI>Елемент| 3
</OL>
<DT>Списки| визначень
<DD>Цей вид списків трохи складніший, ніж два попередніх, але і
виглядає ефектніше.
<P>Пам’ятайте|, що списки можна вбудовувати один в іншій, але не
слід закладати дуже багато рівнів вкладеності. </P>
<P>Зверніть увага, що усередині елементу списку може знаходитися
декілька абзаців. Всі абзаци при цьому матимуть однакове
ліве поле. </P>
</DL>
</body>
</html>
Підсумок заняття: виконати приведені у лекції приклади на ПК, результати – роздрукувати.
Підготуватися до лабораторної роботи, вивчити основні теги форматування тексту, гіперпосилань та списків.