2. Текстовые элементы html
Параграфы, заголовки, элементы логического и физического форматирования текста. Списки, гиперссылки.
Содержание
Заголовки и абзацы
Заголовок (h1..h6 - header 1...6)
Абзац (p - paragraph)
Логическое и физическое форматирование. Разбивка на строки
Выделения (strong, em - emphasis, span)
Управление разбивкой текста на строки (br, nobr, pre)
Секция, список
Секция (div - division)
Список (ol - ordered list, ul - unordered list)
Таблица (table)
Якорь. Специальные символы
Якорь (a - anchor)
Специальные символы
Вопросы
Разобравшись со структурой HTML-документа, логично перейти к изучению того, как наполнять документ содержанием. В первую очередь, это текст. Как уже говорилось, текст в html-файл можно поместить и безо всякой структуры. Однако, если соблюдать правила, то следует выбрать для текста подходящий контейнер и разместить его в элементе body.
Рассмотрим наиболее важные текстовые контейнеры.
Заголовки и абзацы
Заголовок (h1..h6 - header 1...6)
Заголовки имеют большое значение. Для пользователя они создают ориентиры в документе и проясняют его структуру, а поисковые серверы используют заголовки, чтобы индексировать структуру и содержание веб-страниц.
Элемент h1 определяет наиболее крупный заголовок; h6 - наименее крупный. Заголовки h1 должны использоваться как главные заголовки, сопровождаемые заголовками h2, затем менее важными заголовками h3, и так далее. Обычно авторы применяют h1 для названия документа, h2 для названий разделов и т.д.
<h1>
Это заголовок 1</h1>
<h2>
Это заголовок 2</h2>
<h3>
Это заголовок 3</h3>
<h4>
Это заголовок 4</h4>
<h5>
Это заголовок 5</h5>
<h6>
Это заголовок 6</h6>
Листинг 2.1. Заголовки уровней 1-6 (html, txt)
Рис. 2.1. Заголовки уровней 1-6
Обратите внимание, что каждый заголовок располагается на новой строке и имеет вертикальный отступ от соседних элементов. Первое свидетельствует о том, что заголовок - элемент блочный, т.е. всегда вызывает разрыв строки до и после себя. Второе означает, что предопределённые значения отступов для этого элемента отличны от нуля (как их можно регулировать, далее будет рассматриваться).
Абзац (p - paragraph)
Служит для смысловой разбивки текста. Браузеры, отображая содержимое этого элемента (также блочного), обычно вставляют перед ним вертикальный отступ, немного больший по высоте, чем одна строка - таким образом абзацы отделяются друг от друга по умолчанию. При помощи стилей можно достичь и более привычного, "книжного" вида - горизонтального отступа первой строки каждого абзаца. Возможны и другие варианты.
p {
text-indent: 2.5em;
margin-top: 0.2em;
margin-bottom: 0.2em;
}
...
<p>
По умолчанию браузер визуально отделяет абзацы друг от друга вертикальным
отступом, что эквивалентно установке свойств margin-top и margin-bottom
в некоторое отличное от нуля значение.
</p>
<p>
В данном примере этим свойствам задано небольшое значение (0.2em, т.е.