Web Мастеру.
Чтиво.
<<< Назад
Глава 4. Организация текста внутри
документа
HTML позволяет
определять внешний вид целых абзацев текста. Абзацы можно организовывать в
списки, выводить их на экран в отформатированном виде, или увеличивать левое
поле. Разберем все по порядку.
Ненумерованные списки: <UL>
... </UL>
Текст, расположенный
между метками <UL> и </UL>, воспринимается как
ненумерованный список. Каждый новый элемент списка следует начинать с метки
<LI>. Например, чтобы создать вот такой список:
- Иван;
- Данила;
- белая кобыла
необходим вот такой
HTML-текст:
<UL>
<LI>Иван;
<LI>Данила;
<LI>белая кобыла
</UL>
Обратите внимание:
у метки <LI> нет парной закрывающей метки.
Нумерованные списки: <OL>
... </OL>
Нумерованные списки
устроены точно так же, как ненумерованные, только вместо символов, выделяющих
новый элемент, используются цифры. Если слегка модифицировать наш предыдущий
пример:
<OL>
<LI>Иван;
<LI>Данила;
<LI>белая кобыла
</OL>
получится вот такой
список:
- Иван;
- Данила;
- белая кобыла
Списки определений: <DL>
... </DL>
Список определений
несколько отличается от других видов списков. Вместо меток <LI>
в списках определений используются метки <DT> (от английского
definition term — определяемый термин) и <DD> (от английского
definition definition — определение определения). Разберем это на примере.
Допустим, у нас имеется следующий фрагмент HTML-текста:
<DL>
<DT>HTML
<DD>Термин HTML (HyperText Markup Language) означает
'язык маркировки гипертекстов'. Первую версию HTML
разработал сотрудник Европейской лаборатории физики
элементарных частиц Тим Бернерс-Ли.
<DT>HTML-документ
<DD>Текстовый файл с расширением *.html
(Unix-системы могут содержать файлы
с расширением *.htmll).
</DL>
Этот фрагмент будет
выведен на экран следующим образом:
- HTML
- Термин HTML (HyperText Markup
Language) означает 'язык маркировки гипертекстов'. Первую версию HTML разработал
сотрудник Европейской лаборатории физики элементарных частиц Тим Бернерс-Ли.
- HTML-документ
- Текстовый файл с расширением
*.html (Unix-системы могут содержать файлы с расширением *.htmll).
Обратите внимание:
точно так же, как метки <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>
Форматированный текст: <PRE>
... </PRE>
В самом начале
мы говорили о том, что браузеры игнорируют множественные пробелы и символы
конца строки. Из этого правила, однако, есть исключение.
Текст, заключенный
между метками <PRE> и </PRE> (от английского
preformatted — предварительно форматированный), выводится браузером на экран
как есть — со всеми пробелами, символами табуляции и конца строки. Это очень
удобно при создании простых таблиц.
Текст с отступом: <BLOCKQUOTE>
... </BLOCKQUOTE>
Текст, заключенный
между метками <BLOCKQUOTE> и </BLOCKQUOTE>,
выводится браузером на экран с увеличенным левым полем.