Основні засоби форматування тексту

Як і в Word, основою структури тексту в HTML є абзац. Для виділення абзацу служить тег <P>, закривати який не обов'язково. У тегі <P> можна вказати спосіб вирівнювання тексту абзацу у вигляді <P ALIGN="опція_вирівнювання">. Для вирівнювання тексту абзацу по лівому краю, правому краю, по центру або по ширині слід використовувати, відповідно, опції LEFT, RIGHT, CENTER, JUSTIFY (останній тільки в нових браузерах). Так само можна вирівнювати і заголовки в тегах <H1>,...,<H6> (див. табл. 2).

При "ручному" наборі тексту для HTML-документа слід уникатиперенесень слів по складах і вирівнювання тексту за допомогою пропусків або табуляцій. Все форматування в HTML здійснюється через теги, а перенесення рядків і кількість символів в рядку не мають значення.

Для примусового розриву рядка усередині абзацу служить тег <BR>. Якщо Ви хочете, навпаки, заборонити перенесення в якійсь частині тексту, слід укласти її в тег <NOBR>...</NOBR>.

Деякі символи є для HTML службовими і при "ручному" наборі HTML-документа замість них слід використовувати поєднання символів з таблиці 3:

Табл. 3. Службові символи HTML

Символ Позначення в HTML
< &lt;
> &gt;
& &amp;
" &quot;

Якщо потрібно вставити в текст один або декілька незмінних пропусків, для цього використовується поєднання символів &nbsp;

Для форматування тексту абзаців використовуйте теги, приведені в таблиці 4:

Табл. 4. Деякі теги форматування тексту

Тег Пояснення Зразок
<H1>...</H1> Заголовок 1 рівня Заголовок1  
<H2>...</H2> Заголовок 2 рівні Заголовок2  
<H3>...</H3> Заголовок 3 рівні Заголовок3  
<H4>...</H4> Заголовок 4 рівні Заголовок4  
<H5>...</H5> Заголовок 5 рівня Заголовок5  
<H6>...</H6> Заголовок 6 рівня Заголовок6  
<BIG>...</BIG> Великою Великою  
<SMALL>...</SMALL> Маленький Маленький  
<SUP>...</SUP> Верхній індекс Верхній індекс  
<SUB>...</SUB> Нижній індекс Нижній індекс  
<B>...</B> Жирний Жирний  
<I>...</I> Курсив Курсив  
<U>...</U> Підкреслений Підкреслений  
<S>...</S> Перекреслений Перекреслений  


Окрім вказаних вище елементів фізичного форматування, існують тегі логічного форматування, службовці, наприклад, для виділення цитат, важливих фрагментів тексту, імен змінних і т. д. Інформацію про них можна знайти в довідковій літературі.

Розмірами і зображеннями шрифту можна управляти також за допомогою тегу

<FONT FACE="Шрифт" SIZE="Размер">

де "Шрифт" ім'я шрифту Windows, а розмір указується цифрою від 1 до 7, наприклад, цей текст відформатував тегом <FONT FACE="Arial" SIZE="5">. Розмір шрифту за умовчанням зазвичай рівний 3. Зрозуміло, для коректного відображення тексту яким-небудь шрифтом він повинен бути встановлений на машині користувача, тому слід уникати "екзотичних" шрифтів. За умовчанням браузери підтримують один стандартний масштабований шрифт (звичайно це Times New Roman) і один шрифт для відображення тексту, що заздалегідь відформатував, у тегі <PRE> (зазвичай Courier New).

Опція face дозволяє також вказати декілька шрифтів через кому в цьому випадку для форматування тексту буде використаний перший відповідний шрифт із списку:

<font face="Verdana, Arial, Helvetica">

Для відображення тексту, що заздалегідь відформатував,із збереженням перенесень рядків, табуляцій і інтервалів, використовується тег <PRE width="N">, де N необов'язкова опція, вказуюча бажаний розмір рядка в символах. Якщо потрібна гарантія, що всі символи тексту, що відформатував, матимуть однакову ширину, слід використовувати тег <TT>. Приклади:

Текст у тегі TT

Текст у тегі PRE

Для створення в документі текстового розділувикористовується тег <div>...</div>, з опцією align, вказуючою спосіб вирівнювання тексту в розділі (так само, як в таге <p>). Вказаний у тегі <div> спосіб вирівнювання тексту використовується за умовчанням у всіх абзацах цього розділу, якщо в абзаці в явному вигляді не вказаний інший спосіб вирівнювання. Для розміщення частини документа по центру вікна браузера можна також використовувати тег <center>...</center>

Відокремити частину тексту горизонтальною межею можна за допомогою тега <HR>. Опція ALIGN із значенням LEFT, RIGHT або CENTER визначає вирівнювання межі на сторінці, опція SIZE="размер" товщину лінії в пікселах, а опція WIDTH="ширина" ширину, вказану в пікселах (наприклад, 600) або відсотках (100%). Якщо вказана опція NOSHADE, лінія створюється без тривимірних ефектів. Приклад:

Ця межа створена тегом вигляду <HR ALIGN="CENTER" SIZE="1" WIDTH="50%">