HTML - Форматирование документа

Базовое форматирование текста

Базовая разметка документа в HTML

В HTML документы записываются в обычном текстовом формате и поэтому могут быть созданы и отредактированы в любом текстовом редакторе.

Пример документа в HTML
Основные элементы
Стили
Специальные символы
Прерывание строки
Горизонтальная линия
Верхние и нижние индексы
Преформатируемый текст

Пример документа в HTML

Любой гипертекст похож на книгу и может быть разбит на отдельные структурные элементы:

Собственно документ
Главы, параграфы, пункты, подпункты
Абзацы

Для каждого из этих элементов в HTML существуют определенные стили, описывающие в каком виде пользователь увидит текст на экране. Пусть мы создали некоторый файл:

<HTML> <HEAD> <TITLE>Пример HTML-текста</TITLE> </HEAD> <BODY> <H1>Глава 1</H1> <H2>Параграф 1.</H2> Добро пожаловать в HTML! Здесь мы расскажем, как надо и как не надо писать гипертексты.<P> <H2>Параграф 2.</H2><P> </BODY> </HTML>

Этот текст выглядит так.

Глава 1

Параграф 1.
Добро пожаловать в HTML! Здесь мы расскажем, как надо и как не надо писать гипертексты.

Параграф 2.

Основные элементы

Как уже отмечалось язык HTML не различает, какими буквами набраны команды форматирования (нечувствителен к регистру): <title> равносильно <TITLE> или <TiTlE>. Основной текст документа (тело) отделяется от заголовка документа Командами:

<BODY> </BODY>

Заголовок

Каждый HTML-документ должен иметь заголовок, он показывается отдельно и используется, прежде всего, для идентификации документа (например, при поиске). Заголовок должен описывать цель документа и содержать не больше 5-6 слов. Для задания заголовка служат команды:

<HEAD><TITLE>Заголовок</TITLE></HEAD>

Заголовки разделов документов

HTML имеет шесть уровней заголовков разделов, имеющих номера с 1 по 6 (заголовок первого уровня является заголовком высшего уровня). По сравнению с нормальным текстом, заголовки выделяются шрифтом - размером и толщиной букв. Заголовок первого уровня должен быть выделен <H1>. Синтаксис заголовков: <Hn>Текст заголовка</Hn > где n - число от 1 до 6, определяющее уровень заголовка.

Абзацы

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

   <H2>Параграф 1.</H2>
   Добро пожаловать в HTML!
   Здесь мы расскажем, как надо и как не надо писать гипертексты.<P>

В исходном файле два предложения находятся на двух разных строках. Броузер игнорирует это перерывание строки и начинает новый абзац только, после знака < P>.

Однако, чтобы сохранить удобочитаемость в исходных HTML-файлах, мы рекомендуем заголовки размещать на отдельных строках, а абзацы отделять пустыми строками (в дополнение к команде < P>).

Также заметим, что хотя в действующих версиях HTML нет команды форматирования "конец абзаца" < /P>, рекомендуется его употреблять, поскольку это соответствует стандарту и он может быть введен в последующих версиях. К ошибке это не приведет, поскольку все незнакомые символы броузер просто игнорирует. Иначе Вам в последствии, может быть, придется переделывать Ваши HTML-документы.

Стили

Можно описывать специальными стилями отдельные слова или предложения. Имеются два типа стилей: логический и физический.

Логические стили

<DFN>: служит для описания определений. (Это определение.)
<EM>: служит для выделения слов. (Это выделенное слово.)
<CITE>: служит для выделения заголовков книг, фильмов, цитат и т.п. (Это цитата)
<CODE>: служит для выделения программных кодов, текстов программ и т.п. Изображается шрифтом фиксированной ширины. (The <stdio.h> header file)
<KBD>: используется для ввода с клавиатуры пользователя. Может быть изображено жирным шрифтом (но в большинстве броузеров изображается специальным шрифтом). (Введите passwd)
<SAMP>: используется для машинных сообщений. Изображается шрифтом фиксированной ширины. (Segmentation fault: Core dumped.)
<STRONG>: служит для ОСОБОГО выделения слов. Обычно выделяется жирным шрифтом (Это очень важно )
<VAR>: используется для символьных переменных. (Это переменная.)

Физические стили

Существуют физические способы выделения - автор задает стиль написания текста, описывая шрифт в исходном HTML-документе.

Вы можете задать:

<B>, </B>: жирный шрифт (это жирный шрифт)
<I>, </I>: наклонный шрифт (это наклонный шрифт)
<TT>, </TT>: фиксированный шрифт (шрифт заданной ширины) (это fixed шрифт)

Специальные символы

Символы <, >, & и " имеют в HTML особое значение, как символы форматирования. Но иногда нам необходимо использовать их в тексте по своему прямому назначению. Для их введения в текст, вы должны использовать:

< - знак "меньше": <
> - знак "больше": >
& - амперсанд: &
" - кавычка: "

ЗАМЕЧАНИЕ: Специальные символы чувствительны к регистру: НЕЛЬЗЯ использовать &LT; вместо <.

Прерывание строки

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

Например:

Институт<BR>В котором мы учимся<BR>

даст на экране:

Институт
В котором мы учимся

Горизонтальная линия

Используя команду <HR> Вы можете разделить текст горизонтальной чертой:

Этот текст сверху от линии.

Этот текст снизу от линии.

Верхние и нижние индексы

Если просмотрщик поддерживает стандарт языка HTML, то вы можете использовать в тексте верхние и нижние индексы с помощью команд SUP and SUB.

Эти команды уменьшают размер текста, располагаемого вверху или внизу от строки. Например:

верхний индекс B<sup>a</sup> и нижний индекс B<sub>a</sub>

имеет следующий вид:

верхний индекс B^a и нижний индекс B_a

Преформатируемый текст

Вы можете включать в гипертекстовый документ текстовые фрагменты набранные и отформатированные в каком-либо текстовом редакторе (например, Norton Edit) без разметки HTML, в том виде как от есть. Для этого используется команда <pre> </pre>. Текст за исключением специальных символов будет выводится равноширинным шрифтом с сохранением всех пробелов и переводов строк исходного текста. Специальные символы нужно набирать по правилам, которые были указаны выше.

Например:

<pre> Вы можете включать в гипертекстовый документ текстовые фрагменты набранные и отформатированные в каком-либо текстовом редакторе (например, Norton Edit) без разметки HTML, в том виде как от есть. Для этого используется команда <pre> </pre>. </pre>

Что даст:

   Вы можете включать в гипертекстовый документ текстовые
фрагменты  набранные  и отформатированные  в   каком-либо
текстовом редакторе  (например, Norton Edit) без разметки
HTML,  в  том  виде как от есть.   Для этого используется
команда <pre> </pre>.

Замечание: не рекомендуется для этого использовать тексты, подготовленные в редакторе "ЛЕКСИКОН", так как последний вставляет в документ собственные символы форматирования, которые могут быть показаны просмотрщиком пользователю, причем в самом неожиданном виде, особенно если ваш сервер использует перекодировщики для перевода текста в различные кодовые таблицы.