Организация текста внутри документа
HTML позволяет определять внешний вид целых абзацев текста. Абзацы можно организовывать в списки, выводить их на экран в отформатированном виде или увеличивать левое поле. Разберём всё по порядку.
Ненумерованные списки: <ul> ... </ul>
Текст, расположенный между тегами <ul> и </ul>, воспринимается как ненумерованный список. Каждый новый элемент списка следует начинать с тега <li>. Например, чтобы создать вот такой список:
- Иван;
- Данила;
- белая кобыла
необходим вот такой HTML-код:
<ul>
<li>Иван;
<li>Данила;
<li>белая кобыла
</ul>Обратите внимание: у тега <li> нет парного закрывающего тега, но их рекомендуется использовать для соблюдения стандартов HTML5.
Нумерованные списки: <ol> ... </ol>
Нумерованные списки устроены точно так же, как ненумерованные, только вместо символов, выделяющих новый элемент, используются цифры. Если слегка модифицировать наш предыдущий пример:
<ol>
<li>Иван;
<li>Данила;
<li>белая кобыла
</ol>получится вот такой список:
- Иван;
- Данила;
- белая кобыла
Списки определений: <dl> ... </dl>
Список определений несколько отличается от других видов списков. Вместо тегов <li> в списках определений используются теги <dt> (от английского definition term — определяемый термин) и <dd> (от английского definition description — описание определения). Разберём это на примере. Допустим, у нас имеется следующий фрагмент 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).
Обратите внимание: теги <dt> и <dd> теперь рекомендуется закрывать в соответствии со стандартами HTML5.
Форматированный текст: <pre> ... </pre>
В самом начале мы говорили о том, что браузеры игнорируют множественные пробелы и символы конца строки. Из этого правила, однако, есть исключение.
Текст, заключённый между тегами <pre> и </pre> (от английского preformatted — предварительно форматированный), выводится браузером на экран "как есть" — со всеми пробелами, символами табуляции и конца строки. Это очень удобно при создании простых таблиц.
Текст с отступом: <blockquote> ... </blockquote>
Текст, заключённый между тегами <blockquote> и </blockquote>, выводится браузером на экран с увеличенным левым полем.