font-family

Internet Explorer			Chrome			Opera			Safari			Firefox
6.0	7.0	8.0	2.0	3.0	4.0	9.2	9.6	10	2.0	3.1	4.0	2.0	3.0	3.6

Краткая информация

Значение по умолчанию	Шрифт, установленный в браузере по умолчанию. Обычно это Times New Roman.
Наследуется	Да
Применяется	Ко всем элементам
Ссылка на спецификацию	http://www.w3.org/TR/CSS21/fonts.html#propdef-font-family

Версии CSS

CSS 1	CSS 2	CSS 2.1	CSS 3

Описание

Устанавливает семейство шрифта, которое будет использоваться для оформления текста содержимого. Список шрифтов может включать одно или несколько названий, разделенных запятой. Если в имени шрифта содержатся пробелы, например, Trebuchet MS, оно должно заключаться в одинарные или двойные кавычки.

Когда браузер встречает первый шрифт в списке, он проверяет его наличие на компьютере пользователя. Если такого шрифта нет, берется следующее имя из списка и также анализируется на присутствие. Поэтому несколько шрифтов увеличивает вероятность, что хотя бы один из них будет обнаружен на клиентском компьютере. Заканчивают список обычно ключевым словом, которое описывает тип шрифта — serif, sans-serif, cursive, fantasy или monospace. Таким образом, последовательность шрифтов лучше начинать с экзотических типов и заканчивать обобщенным именем, которое задает вид начертания.

Синтаксис

font-family: имя шрифта [, имя шрифта[, ...]] | inherit

Значения

Любое количество имен шрифтов разделенных запятыми. Универсальные семейства шрифтов:

serif — шрифты с засечками (антиквенные), типа Times;
sans-serif — рубленные шрифты (шрифты без засечек или гротески), типичный представитель — Arial;
cursive — курсивные шрифты;
fantasy — декоративные шрифты;
monospace — моноширинные шрифты, ширина каждого символа в таком семействе одинакова (шрифт Courier).

inherit: Наследует значение родителя.

Пример

HTML 4.01CSS 2.1CSS 3IE 6IE 7IE 8Op 9.6Op 10Sa 3.1Sa 4Cr 3Ff 3.0

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>font-family</title>
  <style type="text/css">
   H1 {
    font-family: Geneva, Arial, Helvetica, sans-serif;
   } 
   P {
    font-family: Georgia, 'Times New Roman', Times, serif;
   }
  </style>
 </head> 
 <body> 
  
  <h1>Duis te feugifacilisi</h1>
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem 
  nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. 
  Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit 
  lobortis nisl ut aliquip ex ea commodo consequat.</p>
  
 </body>
</html>

Результат данного примера показан ни рис. 1.

Рис. 1

Рис. 1. Применение свойства font-family

Объектная модель

[window.]document.getElementById("elementID").style.fontFamily

Браузеры

Internet Explorer до версии 7.0 включительно не поддерживает значение inherit.