html.okpython.net
HTML и CSS для начинающих

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

css-свойство font-family (от англ. font familyсемейство шрифта) устанавливает шрифт, который будет использоваться внутри элемента.

Характеристики

  • Значение по умолчанию: шрифт, используемый браузером по умолчанию (обычно Times New Roman).
  • Применяется: ко всем элементам.
  • Наследуется: да.
  • Анимируется: нет.
  • JavaScript: object.style.fontFamily="value".

Синтаксис

font-family: <шрифт> [, <шрифт>[, ...]]

Значения

В качестве значения свойство принимает через запятую имена шрифтов или названия семейства шрифтов. Если в названии шрифта содержатся пробелы, то его нужно указывать в кавычках. Также при выборе шрифтов необходимо учитывать тот факт, что в операционных системах разных пользователей могут быть установлены собственные наборы шрифтов. Поэтому, если хочется применить к элементу какой-нибудь экзотический шрифт, нужно обязательно учитывать эту особенность. В таких случаях обычно первыми указывают редкие шрифты, затем более распространенные, а в конце указывают семейство шрифтов. Если браузер не находит первого шрифта на компьютере пользователя, он начинает искать второй шрифт и так до конца списка указанных в качестве значения шрифтов. Это повышает вероятность того, что хотя бы один и указанных шрифтов будет на компьютере пользователя. Если указанных шрифтов не будет обнаружено, браузер начнет самостоятельно подбирать шрифты из указанного списка семейств шрифтов.

В любой операционной системе по умолчанию доступны следующие стандартные семейства шрифтов:

  • serifшрифты с засечками;
  • sans-serifшрифты без засечек (рубленые шрифты);
  • cursiveкурсивные шрифты (часто напоминают рукописный текст);
  • fantasyдекоративные (художественные) шрифты;
  • monospaceмоноширинные шрифты (все буквы одинаковой ширины).

Если указанные в качестве значения свойства font-family шрифты не будут найдены браузером на компьютере пользователя, а название семейства шрифтов будет отсутствовать, то браузер использует шрифт, установленный по умолчанию. Обычно это шрифт Times New Roman.

Ссылки

Примеры

HTML Результат htmlCodes
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">  
	<title>Пример №1</title>

	<style>
	
		.f_1{
		font-family: arial, tahoma, sans-serif;
		}
		
		.f_2{
		font-family: gabriola;
		}
		
		.f_3{
		font-family: "high tower text", sans-serif;
		}
		
		.f_4{
		font-family: "monotype corsiva", serif;
		}
		
		.f_5{
		font-family: verdana, arial;
		}
		
	</style>
	
</head>
<body>

	<p class="f_1">
		Ко мне применяется шрифт Arial.
	</p>
	
	<p class="f_2">
		Ко мне применяется шрифт Gabriola.
	</p>
	
	<p class="f_3">
		Ко мне применяется шрифт семейства sans-serif.
	</p>
	
	<p class="f_4">
		Ко мне применяется шрифт Monotype Corsiva.
	</p>
	
	<p class="f_5">
		Ко мне применяется шрифт Verdana.
	</p>
	
</body>
</html>

Пример №1