CSS свойство font-family

CSS свойства

Определение и применение

CSS свойство font-family задает шрифт для элемента. Свойство может содержать несколько названий шрифтов, указанных через запятую. Если браузер не поддерживает первый шрифт, он использует следующий указанный шрифт. Шрифты, которые содержат в названии более одного слова, либо цифры необходимо помещать в кавычки.

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

Поддержка браузерами

СвойствоChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
Edge
font-family1.01.03.51.04.012.0

CSS синтаксис:

font-family:"font | initial | inherit";

JavaScript синтаксис:

object.style.fontFamily = "courier"

Значения свойства

ЗначениеОписание
family-name (название шрифта)Название определённого шрифта (из определенного семейства шрифтов, например: arial, courier и т.п.).
generic-family (семейство шрифта)Название набора шрифтов (имеющих характерные общие черты, например: serif (с засечками), sans-serif (без засечек) и т.п.).
initialУстанавливает свойство в значение по умолчанию.
inheritУказывает, что значение наследуется от родительского элемента.

Версия CSS

CSS1

Наследуется

Да.

Анимируемое

Нет.

Пример использования

<!DOCTYPE html>
<html>
<head>
<title>Пример использования свойства font-family.</title>
<style> 
.times {
font-family : "Times New Roman", serif; /* определяем основной шрифт "Times New Roman", альтернативный  serif (с засечками)*/
}
.courier {
font-family : Courier; /* определяем основной шрифт "Courier" */
}
</style>
</head>
	<body>
		<p class = "times">Параграф, отображаемый шрифтом "Times New Roman".</p>
		<p class = "courier">Параграф, отображаемый шрифтом "Courier".</p>
	</body>
</html>
Пример использования свойства CSS font-family.
Пример использования свойства CSS font-family.
CSS свойства