Ненумерованный
список (маркированный) (unordered list) задается двумя тегами: <UL> и <LI>. UL сдвигает абзац вправо, а LI - ставит пульку (bullet).
<HTML>
<HEAD>
<TITLE> Списки </TITLE>
</HEAD>
<BODY>
<H1 align=center>СПИСКИ</H1>
<HR>
<Font face=Arial color=blue size=+2>
<UL
type=circle>
<LH>
<B> Маркированный список </B></LH></Font>
<Font
face=Arial color=green size=+1>
<LI> Минск
<LI> Брест
<LI> Витебск
<LI> Гродно
<LI>
Гомель
<LI>
Могилев
</OL>
</Font>
</BODY>
</HTML>
Нумерованный
список (ordered list) задается тегами <OL> и тем же самым <LI>. Первый тоже сдвигает границу, а второй ставит номер.
Вот пример нумерованного
списка (все отступы вправо сделаны единствен- о для наглядности):
<HTML>
<HEAD>
<TITLE> Списки </TITLE>
</HEAD>
<BODY>
<H1 align=center>СПИСКИ</H1>
<HR>
<Font face=Arial color=blue size=+2>
<OL
type=1>
<LH>
<B>Нумерованный список </B></LH>
</Font>
<Font
face=Arial color=red size=+1>
<LI> Минск
<LI> Брест
<LI> Витебск
<LI> Гродно
<LI> Гомель
<LI> Могилев
</OL>
</Font>
<HR>
</Font>
</BODY>
</HTML>
Вид маркера
определяется атрибутом type:
<UL
type=" circle" >— окружность;
<UL type="disc">
—диск;
<UL type="square"
> — квадрат.
Вид маркера списка устанавливается атрибутом type:
<OL
type="1"> — (1,2, 3,...);
<OL
type="A"> — (А, В, С,...);
<OL type="a">
—(a, b, c,...);
<ol type=
"I"> - (I, II, III,
IV,...);
<OL
type=" i" > — (i, ii, iii,...).
Можно создавать также
комбинированные и многоуровневые списки. Например, так:
<HTML>
<HEAD>
<TITLE>Списки</TITLE>
</HEAD>
<BODY>
<H1>Трехуровневый
список</Н1>
<HR>
<UL>
<LI>Первая
строка<BR>
<LI>Вторая
строка<BR>
<UL>
<LI>Третья
строка<BR>
<LI>Четвертая
строка<BR>
<UL>
<LI>Пятая
строка<BR>
<LI>Шестая
строка<BR>
</UL></UL></UL>
</BODY>
</HTML>
Обратите внимание: мы в
этом примере не задавали в явном виде типы пулек, умный браузер сам на разных
уровнях применил разные.
Задание
Создать комбинированный
список
1. Первая строка
o
Вторая строка
o
Третья строка
o
Четвертая строка
2. Пятая строка
3. Шестая строка
Как скомбинировать UL и 0L, чтобы получить то, что на нашем рисунке находится
внизу справа, вы можете придумать сами. Считайте это самостоятельным
упражнением.
Кстати, тег <LI> можно ставить и без UL или 0L. Не будет сдвига вправо, по умолчанию
ставится простая круглая пулька.
Кстати, тег <LI> можно ставить и без <UL> и <OL>. Не будет сдвига
вправо, по умолчанию ставится простая круглая пулька.
Пример списка определений
<HTML>
<HEAD>
<TITLE>Списки</TITLE>
</HEAD>
<BODY>
<HR>
<Font
face=Arial color=blue size=+2>
<UL
type=circle>
<LH>
<B> Список определений </B></LH></Font>
<Font
face=Arial color=brown size=+1>
<DL>
<DT> <B>Клавиатура </B>
<DD> Предназначена для ввода информации
<DT>
<B>Монитор </B>
<DD> Предназначен для вывода информации
</DL>
</BODY>
</HTML>
Литература:
А.Левин. Самоучитель полезных
программ.Питер. 2008
Комментариев нет :
Отправить комментарий