Веб-компас сайтостроителей
/ Все статьи / HTML / Основы HTML / Управление шрифтом

Управление шрифтом

Для управления шрифтом на веб-страничке можно использовать тег <font>(с закрывающим тегом </font>) и установленными для него следующими атрибутами:
size – задает размер шрифта в условных единицах, может принимать значения от 1 до 7;
color – задает цвет шрифта (подробнее о цвете будет написано ниже);
face - задает имя шрифта, так как заранее неизвестно какие шрифты установлены у пользователя на компьютере, то можно перечислить, через запятую, дополнительно еще несколько названий шрифтов, в порядке убывания предпочтительности.
Например
Код
<font size="5" color="#0080C0"  face="Arial Cyr, Arial, Times New Roman">
Текст для примера.
</font>

Тег <basefont> задает текущий размер шрифта в документе следующим образом
Код
<basefont size="6">

Для увеличения или уменьшения шрифта на одну условную единицу можно использовать теги <big> (</big>) и <small> (</small>).
Выделить текст курсивом можно используя тег <i> (</i>) или тег <em> (</em>). Отличие этих тегов в том, что тег <em> выделяет логически заключенный фрагмент текста (определяет важность данного текста), который браузеры обычно отображают курсивом, а тег <i> - это явное указание на курсив. Например
Код
<p align="center">Разработка <i> Web - сайтов</i></p>

Выделить текст полужирным начертанием можно тегом <b>(</b>). Также можно использовать тег <strong>(</strong>). Опять же, как и с тегом <em> тег <strong> разрабатывался для определения важности заключенного в него текста, но браузеры отображают его полужирным начертанием. Например
Код
<p align="center">Разработка <b>Web-сайтов</b></p>

Для выделения необходимого фрагмента текста подчеркиванием можно использовать тег <u>(</u>). Однако подчеркнутый текст пользователями интернета ассоциируется с гиперссылками, поэтому использовать подобное оформление без крайней необходимости не стоит.
Тег <strike>(</strike>) оформляет текст зачеркнутым. Сокращенная запись этого тега: <s>(</s>). Например
Код
<p align="center"><font size="4" color="#0080C0"  face="Arial Cyr, Arial, Times New Roman">
<b>Разработка <i>Web-сайтов</i></b></font>
<br>
<i>Новая цена: от 10 000 руб.</i>
<br>
<strike>Старая цена: от 20 000 руб.</strike>
</p>

 

Цветовое оформление

Задать цвет элементов на веб-странице можно различными способами. Первый и, наверное, самый распространенный - это задание цвета шестнадцатеричным способом, который в общем случае выглядит следующим образом
#AABBCC
где AA – это интенсивность красной составляющей цвета;
BB – это интенсивность зеленой составляющей цвета;
CC – это интенсивность синей составляющей цвета.
Каждая из составляющих цвета может принимать значения от 0 до FF в шестнадцатеричной системе счисления (то есть от 0 до 255 в десятичной системе счисления). Значение 0 соответствует отсутствию данной составляющей, значение FF соответствует максимальной интенсивности, данной составляющей цвета. Например
Код
<font color="#FF0000">этот текст будет красного цвета</font>

Соответственно, значение #000000 – даст черный цвет, значение #FFFFFF – белый.
Второй вариант задания цвета – это использование название цветов, такие как
  • "black" – черный цвет;
  • "white" – белый цвет;
  • "green" – зеленый цвет;
  • "yellow" – желтый цвет;
  • "fuchsia" – сиреневый цвет и т.д.

Названий цветов очень много, поэтому привел лишь несколько для примера.
Как задать цвет для нужного фрагмента текста было показано выше, теперь посмотрим, как задать цвет для всего текста веб-страницы, а так же и фона.
Атрибут text тега <body> задает цвет текста на веб-странице, атрибут bgcolor задает цвет фона страницы. Например
Код
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
  <title>Задание цветов на веб-странице</title>
</head>
<body text="#0000ff" bgcolor="#80FFFF">

<p>Этот текст будет синего цвета</p>
<p><font color="#FF0000">Этот текст будет красного цвета</font></p>

</body>
</html>
Комментарии к публикации
Всего комментариев: 1
прохожий: Гость | 03.11.2010, 06:19 #
Интересная статья
Добавить комментарий
Новости сайта
Последние публикации в каталоге статей