12.2 Использование шрифтов в HTML

Тег в HTML использовать не рекомендуется. Предполагается, что он будет удален в будущей версии HTML.

Даже если его использует множество людей, лучше стараться его избегать и использовать вместо этого стили.

С помощью следующего кода HTML можно определить как размер шрифта, так и тип вывода в браузере:

<html>
<body>
<p>
<font size="2" face="Verdana">
Это параграф.
</font>
</p>
<p>
<font size="5"
face="Times">
Это другой параграф.
</font>
</p>
</body>
</html>

Пример выполнения данного HTML-кода

Атрибуты шрифта
Атрибут	Пример	Назначение
size=»число»	size=»2″	Определяет размер шрифта
size=»+число»	size=»+1″	Увеличивает размер шрифта
size=»-число»	size=»-1″	Уменьшает размер шрифта
face=»название шрифта»	face=»Times»	Определяет название шрифта
color=»значение цвета»	color=»#eeff00″	Определяет цвет шрифта
color=»название цвета»	color=»red»	Определяет цвет шрифта

Тег НЕ должен использоваться.

Тег не рекомендуется использовать в последних версиях HTML (HTML 4 и XHTML).

Консорциум World Wide Web (W3C) удалил тег из своих рекомендаций. В будущих версиях HTML, для определения свойств компоновки и вывода элементов HTML будут использоваться таблицы стилей (CSS).

Правильно будет использовать стили — Примеры

Задание шрифта текста

<html>
<body>
<h1 style="font-family:verdana">Заголовок </h1>
<p style="font-family:courier">Параграф</p>
</body>
</html>

Пример выполнения данного HTML-кода

Задание размера шрифта текста

<html>
<body>
<h1 style="font-size:150%">Заголовок</h1>
<p style="font-size:80%">Параграф</p>
</body>
</html>

Пример выполнения данного HTML-кода

Задание цвета шрифта текста

<html>
<body>
<h1 style="color:blue">Заголовок
</h1>
<p style="color:red">Параграф</p>
</body>
</html>

Пример выполнения данного HTML-кода

Задание для текста шрифта, его размера и цвета

<html>
<body>
<p
style="font-family:verdana;font-size:80%;color:green">Это параграф, содержащий
некоторый текст. Это текст, содержащийся в параграфе. 
Это все тот же параграф с
текстом.</p>
</body>
</html>

Пример выполнения данного HTML-кода

Прежде всего: Дочитайте до конца это учебное руководство по HTML!!! В последующих лекциях будет показано, почему некоторые теги, такие как , должны быть удалены из рекомендаций HTML, и как использовать таблицы стилей в документе HTML.

Чтобы больше узнать о таблицах стилей, найдите хороший учебник.

Зачем использовать HTML 4.0?

HTML предназначался для других целей!

Исходный HTML не предполагалось использовать для форматирования документа. Теги HTML должны были определять содержимое документа, например:

<p>Это
параграф</p>

<h1>Это
заголовок</h1>

Когда в спецификацию HTML 3.2 были добавлены такие теги как и атрибуты цвета, то для разработчиков Web начался просто кошмар. Разработка больших Web-сайтов, где информацию о шрифтах и цвете нужно добавлять на каждую Web-страницу, стала длительным, дорогим и чрезмерно болезненным процессом.

В чем достоинство HTML 4.0 ?

В HTML 4.0 все форматирование можно удалить из документа HTML и хранить в отдельной таблице стилей.

Так как HTML 4.0 отделяет представление от структуры документа, мы получили то, что всегда требовалось: полный контроль за компоновкой представления без потери содержимого документа.

Не используйте атрибуты представления в тегах HTML, если этого можно избежать. Начните использовать стили! Прочтите учебник по CSS, чтобы познакомиться с таблицами стилей.

Не используйте не рекомендованные теги. Просмотрите полный справочник по HTML 4.01, чтобы узнать, какие теги и атрибуты не рекомендовано использовать.

Готовьтесь к использованию XHTML

XHTML является «новым» HTML. Самая важная вещь, которую можно сделать на данном этапе, — начать писать действительный HTML 4.01 код. Начните также записывать свои теги в нижнем регистре. Всегда закрывайте свои теговые элементы. Никогда не заканчивайте параграф без завершающего .

Примечание: Официальный HTML 4.01 рекомендует использовать теги в нижнем регистре.

Если вы хотите больше узнать о XHTML, почитайте соответствующий учебник.

Проверяйте свои файлы HTML на соответствие HTML 4.01

Документ HTML проверяется согласно Определению типа документа (DTD). Прежде чем файл HTML можно будет проверить, необходимо добавить в качестве первой строки файла правильный DTD.

DTD Strict (строгий) для HTML 4.01 включает элементы и атрибуты, которые рекомендованы к использованию и не появляются в наборах фреймов:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

DTD Transitional (переходный) для HTML 4.01 включает все из строгого DTD плюс не рекомендованные элементы и атрибуты:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">

DTD Frameset (набор фреймов) для HTML 4.01 включает все из переходного DTD плюс также фреймы:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" 
"http://www.w3.org/TR/html4/frameset.dtd">

Проверьте свой файл HTML с помощью средства проверки W3C

Введите адрес своей страницы в поле формы, показанной ниже:

<html>
<head>
<form method="get"
action="http://validator.w3.org/check" target="_blank">Введите адрес своей страницы
в расположенное ниже поле <br />
<br />
<input name="uri" size="50" />
<br /><br />
<input type="submit" value="Validate the page"
/>
</form>
</body>
</html>

Пример выполнения данного HTML-кода