Уроки

Оформляем текст красиво.

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

Теги, используемые для работы с текстом условно можно разделить на 2 типа: теги форматирования и теги оформления. В этом уроке мы разберемся с тегами оформления, т.е. такими тегами, которые позволяют, например, придать тексту жирность, курсивность, подчеркивание, поменять гарнитуру, цвет и размер шрифта.

Для начала, я думаю, надо установить фон Веб-страницы. Обращаю Ваше внимание на то, что цвет в браузере кодируется особым 16-ричным кодом вида #B22222; - это, кстати, код цвета заголовка "Уроки" на этой странице. Цвет и фон страницы выбираются по Вашему желанию, но нужно учитывать и тот факт, что от них зависит визуальное восприятие всего сайта. Попытаемся изменить фон Вашей Веб-страницы.

Впомним материал про то, что некоторые теги используются исключительно с параметрами, которые указываются в открывающемся элементе тега (можно сразу указывать несколько параметров в одном теге). Для задания фона Веб-страницы в строку с тэгом <BODY> Вашего документа нужно добавить параметр BGCOLOR и указать его значение - название цвета или его шестнадцатеричный код, который Вы можете подсмотреть в таблице цветов. То есть красный цвет фона можно задать так: <BODY BGCOLOR="RED"> или так: <BODY BGCOLOR="#FF0000">.

Также и открывающийся тег <FONT> (закрывающийся тег </FONT> обязателен) может иметь несколько атрибутов:

1. атрибут SIZE - задает размер текста (по умолчанию размер текста равен 3). Поместив текст между тэгами <FONT SIZE=n> </FONT>, где n - цифровое значение, Вы придадите ему нужный вам размер. Рассмотрим несколько примеров:
   • <font size="1">Пример 1</font>
   • <font size="2">Пример 2</font>
   • <font size="3">Пример 3</font>
   • <font size="6">Пример 4</font>
2. атрибут FACE - задает стандартное имя шрифта. Используются шрифты, которые установлены на компьютере пользователя, в противном случае Обозреватель будет использовать шрифт по умолчанию (Times New Roman). Например:
   • <font face="Times New Roman">этот пример написан шрифтом Times New Roman</font>
   • <font face="Arial">этот пример написан шрифтом Arial</font>
   • <font face="Verdana">этот пример написан шрифтом Verdana</font>
   • <font face="Comic Sans MS, Tahoma">А в этом примере указано через запятую несколько шрифтов. Так используется семество шрифтов. Если у пользователя на компьютере нет шрифта Comic Sans MS, Обозреватель подставит следующий в этом списке - Tahoma. </font>
3. атрибут COLOR - задает цвет текста (по умолчанию черный - #000000). Аналогично установке фона Веб-страницы цвет текста определятся как самим названием, (например, red), так и представлен в шестнадцатиричном виде - #0000FF (синий). Используется это так:
   • <font COLOR="red">Красный</font>
   • <font COLOR="lightblue"<Голубой</font>
   • <font COLOR="#8A2BE2">Фиолетовый</font>
   • <font COLOR="#4F4F4F">Серый</font>

• <b>Этот тег делает текст жирным </b>
• <i>Этот тег выделяет текст курсивом </i>
• <u>Этот тег делает текст подчеркнутым </u>
• <s>Этот тег делает текст перечеркнутым </s>. Зачастую не поддерживается некоторыми браузерами.
• <blink>Этот тег делает текст мигающим </blink>. Также часто не поддерживается.

Вернуться назад / пойти вперед