На этом шаге мы рассмотрим свойство font-family.
Выбор подходящего шрифта для отдельных частей документа является одним из наиболее часто выполняемых действий в процессе разработки HTML-документа. Шрифты различаются по своему внешнему виду (начертанию), по размеру, по стилю (прямой, курсив или наклонный) и по "жирности" отображения (нормальный, полужирный). Каскадные таблицы стилей предоставляют в распоряжение разработчика набор свойств для установки всех перечисленных параметров шрифтов. Кроме того, есть возможность загружать отсутствующие на компьютере пользователя шрифты непосредственно с сервера, на котором расположен документ.
Рассмотрим наиболее часто используемые свойства шрифтов.
Свойство font-family
Свойство font-family позволяет разработчику страницы задать список шрифтов одного стиля и размера, среди которых браузер может искать необходимый символ, если его нет в используемом пользователем шрифте, или на компьютере нет вообще этого шрифта. В отличие от других свойств каскадных таблиц стилей названия семейств шрифтов в списке отделяются запятыми, например:
BODY { font-family: TimesDL, "Times New", serif; }
При интерпретации HTML-страницы браузер сначала ищет на компьютере пользователя шрифт TimesDL. Если такой шрифт отсутствует, то браузер пытается применить шрифт Times New, а если и он не найден, то используется любой шрифт из семейства шрифтов serif - одного из типовых семейств шрифтов компьютера.
Понятие типовое семейство шрифтов введено в каскадные таблицы стилей с целью реализации сто процентного отображения страницы, если не найдены специально использованные автором шрифты. В любой реализации каскадных таблиц стилей должны существовать пять типовых семейств шрифтов, которые соответствуют реальным шрифтам, обычно устанавливаемым на большинстве компьютеров:
- serif (например, Times);
- sans-serif (например, Helvetica);
- cursive (например, Zapf-Chancery);
- fantasy (например, Western);
- monospace (например, Courier).
Имена шрифтов, состоящих из нескольких слов, должны заключаться в кавычки:
BODY {font-family: "Times New Roman", serif;}
<BODY STYLE="font-family: 'Times New Roman', serif;">
Замечание. Следует использовать кавычки разных типов при задании последовательности всех определяемых свойств в параметре STYLE и при задании имени шрифта в свойстве font-family.
На следующем шаге мы рассмотрим свойство font-style.
