|
Урок 3. Списки
HTML позволяет определять внешний вид целых абзацев текста. Абзацы можно
организовывать в списки.
Ненумерованные списки: <UL> ... </UL>
Текст, расположенный между тегами <UL> и </UL>, воспринимается как
ненумерованный список. Каждый новый элемент списка следует начинать с тега
<LI>. Например, чтобы создать вот такой список:
необходим вот такой HTML-текст:
<UL>
<LI> один
<LI> два
<LI> три
</UL>
Обратите внимание: у тега <LI> нет парного
закрывающего тега.
Нумерованные списки: <OL> ... </OL>
Нумерованные списки устроены точно так же, как ненумерованные, только вместо
символов, выделяющих новый элемент, используются цифры. Если слегка
модифицировать наш предыдущий пример:
<OL>
<LI> один
<LI> два
<LI> три
</OL>
получится вот такой список:
- один
- два
- три
Списки определений: <DL> ... </DL>
Список определений отличается от других видов списков. Вместо тегов <LI>
в списках определений используются теги <DT> и <DD>. Разберем это
на примере.
Допустим, у нас имеется следующий фрагмент HTML-текста:
<DL>
<DT>first
<DD>текст первый - весь этот текст имеет отступ
слева, это работа списков определений
<DT>second
<DD>текст второй ...
</DL>
Этот фрагмент будет выведен на экран следующим образом:
- first
- текст первый - весь этот текст имеет отступ слева, это работа списков определений
- second
- текст второй ...
Обратите внимание: точно так же, как теги <LI>, теги
<DT> и <DD> не имеют парных закрывающих тегов.
Вложенные списки
Списки можно вкладывать друг в друга. То есть список можно вложить в элемент
другого списка. Однако злоупотреблять вложенностью не стоит.
Соберем все, что мы узнали о списках в пример 5:
<html>
<head>
<title>Пятый
HTML-документ</title>
</head>
<body>
<H1 ALIGN=CENTER> Списки в HTML </H1>
<DL>
<p>Ненумерованные списки</p>
<UL>
<LI>один
<LI>два
<LI>три
</UL>
<p>Нумерованные списки</p>
<OL>
<LI> один
<LI> два
<LI> три
</OL>
<DT>Списки определений
<DD><p>Первый
абзац<br>
весь этот текст имеет отступ слева, это работа списков
определений</p>
<p>Второй абзац
<br>
весь этот текст имеет отступ слева, это работа списков
определений</p>
</DL>
</body>
</html>
Урок 2
Содержание
Урок 4
  ЕСТЬ ВОПРОСЫ? ЗАХОДИТЕ НА HTML-ФОРУМ!
Это лучшее место для общения на веб-дизайнерские темы. Здесь вы можете задать интересный вопрос, получить на него не менее интересный ответ и поделиться опытом с коллегами. Что особенно приятно, у форума есть модератор - это исключает пустой треп и вездесущую рекламу в сообщениях. Общайтесь с пользой!
|
