Текст — основа информации. Грамотная подача текстовых блоков на странице чрезвычайно важна, потому что от этого напрямую зависит легкость ее восприятия. Верстальщик же должен уметь правильно форматировать текст. О правилах форматирования поговорим по ходу дела, а пока подробнее остановимся на средствах форматирования.

HTML существует определенный набор элементов для выделения текстовых блоков, обозначения цитат и т. д. Вот эти элементы.

ЕМ

Выделение (в большинстве браузеров выводит текст курсивом). Часто вместо данного элемента используют элемент <i>, что логически неверно, хотя визуально дает тот же результат.

STRONG

Более сильное выделение (в большинстве браузеров выводит текст полужирным). Почти всегда вместо данного элемента используют элемент <в>. Опять же логически это неверно, однако позволяет сэкономить пару десятков байтов.

CITE

Так надо выделять цитату или ссылку на другие ресурсы (в большинстве браузеров выводит текст курсивом).

DFN

Так надо выделять определение термина (в большинстве браузеров выводит текст курсивом).

CODE

Фрагмент компьютерного кода (в большинстве браузеров выводит текст моноширинным шрифтом, обычно таковым является Courier New).

SAMP

Вывод примера программ, сценариев и т. д. (в большинстве браузеров выводит текст моноширинным шрифтом).

О VAR

Так надо выделять переменную или аргумент программы (в большинстве браузеров выводит текст курсивом).

П ABBR

Так выделяют сокращения и аббревиатуры (например, WWW, HTTP, URI; в большинстве браузеров никак не выделяется).

Если вам понадобится использовать длинную цитату, то надо воспользоваться элементом <blockquote>. Браузер обычно отображает этот элемент с отступом, поэтому его часто используют именно для отбивки текста. Такая практика порочна, потому что подобное форматирование лучше делать с помощью CSS. Да, отступ с помощью <blockquote> зачастую сделать проще, и со старыми браузерами проблем не возникает, но эта практика противоречит идеологии HTML. Для расстановки кавычек в HTML 4.0 предусмотрен тег <q>, однако многие браузеры его не понимают, поэтому вместо этого тега надо пользоваться специальными символами. Для русского текста левой кавычке будет соответствовать символ slaquo; правой кавычке —&raquo;.

Ниже дан пример правильно отформатированного текста, а на рис. 1.2 показано, как этот фрагмент кода выглядит в браузере.

<НЗ>Размер шрифта</НЗ>

<Р>Что же нам, бедным, делать? К счастью есть фишка, которая позволяет обойти этот баг Microsoft. Вот он, работающий пример.</Р>

<PXCODE>body. div, p, th, td, li, dd (<BR>

<CITE>/* это все для Netscape 4.x */</CITEXBR>

font-family: Verdana, Lucida, Arial, Helvetica, sans-serif;<BR>

font-size: llpx;<BR>

} </CODEX/P>

Что касается форматирования абзацев, то в HTML оно отличается от привычного книжного форматирования. Если в книге первая строка каждого абзаца смещена, то в HTML-документе между абзацами существует промежуток. Вот пример книжного форматирования абзаца:

Блоковые элементы начинаются с новой строки, то есть они располагаются вертикально друг за другом. Расстояние между блоковыми элементами определяется полями (margin).

Строковые элементы располагаются непосредственно друг за другом, то есть горизонтально. А вот с расстояниями все гораздо сложнее.

Браузер отформатирует абзацы так, как подано на рис. 1.3.

Кроме того, абзацы можно различным образом выравнивать. Делается это с помощью атрибута align, который имеет несколько значений:

D left — текст в абзаце выравнивается по левому краю;

D center — текст в абзаце выравнивается по центру;

П right — текст в абзаце выравнивается по правому краю;

П justify — текст в абзаце выравнивается по обоим краям (по ширине). Данный код будет выравнивать абзац по правому краю, как на рис. 1.4.

<Р ALIGN=right>CTpoKOBbie элементы располагаются непосредственно друг за другом, то есть горизонтально. А вот с расстояниями все гораздо сложнее.</Р>

Использование такого способа выравнивания является нежелательным с точки зрения спецификации языка HTML 4.0. Выравнивание, как и многие атрибуты, относится к визуальной модели форматирования. Язык HTML должен структурировать документ, и не более того, а визуальное представление обеспечивается средствами CSS. На самом деле, это идеальная модель, которая чрезвычайно редко воплощается на практике. Существует много преград, но основная — необходимость подстраиваться под старые браузеры типа Netscape Navigator 4.л, которые очень плохо поддерживают CSS. Так что довольно часто приходится смешивать содержание HTML-документа и его визуальное представление. Впрочем, скоро пятое поколение браузеров окончательно сменит четвертое, и тогда задача разделения структуры документа и визуального представления станет решаемой.

Есть еще несколько элементов для работы с текстом, однако основные мы с вами разобрали, а остальные вы сможете освоить самостоятельно. В дополнение отмечу, что для принудительного перевода строки существует тег <br>.