Форматирование текста

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

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

Чтобы это сделать, надо научиться пользоваться тегами. Тег – элемент документа, который указывают браузеру, как следует показывать страницу. Все, что внутри тега называется содержимым этого тега. Новый абзац в HTML документе следует делать с помощью тега <p>. Также нужен закрывающий тег в конце абзаца </p>.

Чтобы форматирование текста было интереснее, ему можно придать дополнительные свойства с помощью CSS. Причем, свойства можно задать как всему документу в целом, так и отдельным тегам. Так, тегу <p> можно дополнительно указать шрифт, размер, отступ по всем сторонам и ряд других свойств.

Свойство font-family подскажет браузеру, какой будет использоваться шрифт, а text-indent укажет на размер отступа. Причем, значение может указываться как в пикселях, так и в процентах или в прочих единицах измерения.

Есть и другие интересные свойства. Например, text-align задает выравнивание текста, который по умолчанию выстраивается по левому краю, но верстальщик может изменить это состояние.

Допустимо использовать одно из четырех значений:

Left – Текст выравнивается по левому краю. Справа текст получается неровным.

Right – Текст выравнивается по правому краю, а неровным становится левый.

Center – Текст выравнивается по центру. Оба края остаются неровными. Как правило, свойство используется для заголовков.

Justify – Выравнивание текста происходит по ширине. Оба края остаются ровными за счет меняющегося пространства между словами.

Но и это еще не все! Здесь, также можно изменить расстояние между словами с помощью свойства word-spacing и интервал между строк с помощью letter-spacing.

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

<sup> и </sup>. Тег верхнего индекса.

<sub> и </sub>. Тег нижнего индекса.

<pre> и </pre>. Текст отображается на экране точно также как пишется. ( Пользоваться этим тегом следует для отображения программного кода, в остальных случаях считается «дурным тоном».)

<em> и </em>. Наклонный текст.

<strong> и </strong>. Полужирный текст.

<code> и </code>. Содержимое контейнера будет отображаться кодовым текстом.

<samp> и </samp>. Моноширинный текст.

<abbr titlle=“Расшифровка аббревиатуры“> Аббревиатура.

<br> и </br>. Тег принудительного перевода текста на новую строку. Если тег не указывается, браузер автоматически определяет необходимость новой строки, руководствуясь размером экрана и размером используемого шрифта.

<!-- и -->. Содержимое данного контейнера не отображается на экране пользовательского компьютера и нужно для того, чтобы оставить комментарий самому себе или другому верстальщику, который возьмет проект на себя.

Для форматирования текста в документах HTML присутствуют и другие теги. Например, тег <h1> и закрывающий тег </h1> указывают браузеру на заголовок. Причем, поскольку заголовков в теле документа может быть несколько, также присутствуют и дополнительные теги <h2>, <h3>;… <h6>. При этом, тег <h1> в документе может быть, только один. Это самый главный заголовок.

Попробуйте самостоятельно написать текст и выполнить форматирования текста в файле блокнота с расширением *.txt перепишите его на *.html и сохраните. Если все получилось, переходите к более сложным задачам. При возникновении трудностей лучше повторить попытку до тех пор, пока не получится выполнить все правильно.

Для их выполнения также придется познакомиться с новыми тегами.