Текст

Текст

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

Как правило, это:

? Georgia;

? Times New Roman;

? Arial;

? Verdana;

? Comic Sans MS.

Шрифты подразделяются на шрифты с засечками (типа Georgia, Times New Roman), шрифты без засечек (типа Arial, Verdana) и фантазийные (типа Comic Sans MS).

Чтобы отделить один абзац текста от другого, следует применять тег <P>. А если при этом нужно выровнять текст абзаца к левой или правой стороне страницы, то делается это с помощью атрибута (служебного слова) align так:

? <P align=left> — если нужно выровнять абзац к левой стороне;

? <P align=right> — если нужно выровнять абзац к правой стороне.

Наберем отрывок из рассказа Валентина Катаева "Поединок" с заголовком и разбивкой на абзацы, под текстом напишем фамилию автора, сдвинув ее вправо. Сохраним этот файл под именем, скажем, poedinok.html (листинг П1.6).

Рис. П1.11. Файл poedinok.html в браузере

А теперь откроем этот файл в браузере (рис. П1.11).

Если текст нужно начать не с нового абзаца, а просто со следующей строки (например, в стихотворениях), то вместо тега <P> ставят тег <BR> (листинг П1.7).

Рис. П1.12. Принудительный перевод строчек с помощью тега <BR>

В браузере получится следующая картина (рис. П1.12).

Для выделения текста жирным шрифтом нам пригодятся теги <B> или <STRONG>. Имейте в виду, что оба они имеют пару — закрывающий тег (с косой чертой).

А вот чтобы сделать текст наклонным, существует тег <I>, который также имеет парный закрывающий тег </I>.

Для подчеркивания текста служит тег <U>, для зачеркивания — тег <STRIKE>. Они также имеют закрывающие теги </U> и </STRIKE> соответственно.

А можно ли сделать текст, к примеру, одновременно и жирным, и наклонным? Конечно можно, для этого надо применить к тексту оба тега — нужно только следить, чтобы они были правильно вложены, например, так:

<STRONG><I>Этот текст и жирный и наклонный</I></STRONG>

А вот так неправильно:

<STRONG><I>Этот текст и жирный и наклонный</STRONG></I>

Поясню это на примере (листинг П1.8).

Сохраните этот файл под любым именем, например variant.html, и затем откройте его в браузере. Получим следующее (рис. П1.13).

Рис. П1.13. Варианты текста

Для того чтобы изменить цвет текста, существует тег <FONT> с атрибутом COLOR, также имеющий свою пару — закрывающий тег </FONT>. Цвет может быть задан как просто названием цвета, так и числовым его значением — главное, не забывать перед числовым значением ставить знак решетки: #.

Например:

? <FONT color="red">Это красный цвет</FONT>

? <FONT color=#FF0000>Это тоже красный цвет</font>

В табл. П1.1 приведены числовые значения самых распространенных цветов.

Можно также изменять и размер шрифта, достаточно добавить к нему тег <FONT> с атрибутом SIZE.

Таблица П1.1. Числовые значения цветов

А атрибутом face можно задать гарнитуру шрифта. Тег <FONT> также имеет свою закрывающую пару: </FONT>.

К сожалению, из-за строгого ограничения на объем книги, я не могу, как бы ни хотелось, рассказать здесь обо всем, хотя бы понемногу. Но самое необходимое, все же, стараюсь объяснить. Попробую показать на примере варианты применения гарнитур, размеров и цветов шрифта (листинг П1.9).

В браузере это будет выглядеть так (рис. П1.14). Цвета шрифтов вы здесь, конечно, не увидите, но можете поверить мне на слово или воспроизвести все это самостоятельно на своем компьютере.

Рис. П1.14. Гарнитура, размер и цвет шрифта