Семейство шрифтов (HTML)

Выбор семейства шрифтов в (X) HTML , CSS и производных системах определяет список приоритетных шрифтов и общих названий семейств; В сочетании с соответствующими свойствами шрифта этот список определяет конкретную гарнитуру шрифта, используемую для отображения символов. Выбор семейства доступен в двух формах: в устаревшем формате (X)HTML. ... элемент со своим face атрибут, а в CSS font-family свойство.

термина CSS Семейство шрифтов сопоставляется с типографским термином «шрифт» , который представляет собой группу шрифтов, определенных общими стилями дизайна. Шрифт — это особый набор глифов (форм символов), отличающийся от других шрифтов того же семейства дополнительными свойствами, такими как толщина штриха, наклон, относительная ширина и т. д. Термин «шрифт» в CSS сопоставляется со словом «шрифт»; это определяется сочетанием семейства шрифтов и дополнительных свойств.

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

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

Примеры

В следующем примере один и тот же шрифт ( Times или засечка по умолчанию , 14 пунктов, курсив) определяется тремя способами:

С CSS в отдельной таблице стилей.
При применении встроенного CSS к элементу через style атрибут.
С устаревшим презентационным элементом ... и его нестандартный атрибут face. ( ... в целом не устарел, но его использование в презентационных целях является устаревшим.)

.text { font-family: times, serif; font-size:14pt; font-style:italic; }

<p class="text">
Sample text formatted with CSS in a separate stylesheet.
</p>

<p style="font-family: times, serif; font-size:14pt; font-style:italic">
Sample text formatted with inline CSS.
</p>

<p><i><font face="times, serif" size="3">
Sample text formatted with the deprecated FONT tag.
</font></i></p>

Рекомендуется . ставить пробел после запятой и помещать любое имя, содержащее пробелы, в кавычки

Название шрифта как фамилия

Хотя CSS пытается определить семейство шрифтов так же, как и гарнитуру, font-family запись и ее нестандартный предшественник HTML также исторически использовались для идентификации всего шрифта . Такое использование связано с тем, что файлы шрифтов не описывают себя как часть семейства, что частично мотивировано тем фактом, что немногие редакторы в то время поддерживали выбор между более чем четырьмя стилями шрифтов (жирный/обычный и курсив/обычный).

В результате раньше было обычным явлением такие объявления, как font-family: 'Gill Sans Extrabold', 'Heisei Mincho W9' вместо педантично правильного font-family: 'Gill Sans', 'Heisei Mincho'; font-weight: 900. Ни CSS2, ни CSS3 не одобряют такое использование (они не встречаются в примерах), но, тем не менее, большинство браузеров принимают их как допустимые «имена».

Общие шрифты

Семейство шрифтов может использовать определенный именованный шрифт (например, Heisei Mincho W9 ), но результат зависит от шрифтов, установленных на компьютере пользователя. Фактический внешний вид будет зависеть от браузера и шрифтов, установленных в системе. ^[1] как New Times засечек Roman , Например, при установке Firefox по умолчанию в Microsoft Windows оба шрифта с засечками будут отображаться а оба шрифта без — как Arial .

Обычно только небольшая их часть, в основном шрифты с засечками, без засечек, моноширинные и курсивные. ^[2] легко настраиваются пользователем в веб-браузерах.

Многие системы также выполняют специальную замену шрифтов , чтобы заменить отсутствующие «хорошо известные» семейства метрически-совместимыми альтернативами. Например, Windows заменяет Helvetica на Arial, а Times на Times New Roman. ^[3] Эти семейства не являются универсальными в смысле CSS и обычно не обрабатываются на уровне браузера.

См. также

Примечания

^ «Шрифты» . W3.org . Проверено 21 сентября 2013 г.
^ очень немногие веб-браузеры, включая Konqueror , поддерживают изменение Cursive.
^ «Шрифтовые технологии – глобализация» . docs.microsoft.com . 31 января 2022 г.

[ccs-ref-1] «Шрифты» . W3.org . Проверено 21 сентября 2013 г.

[2] очень немногие веб-браузеры, включая Konqueror , поддерживают изменение Cursive.

[3] «Шрифтовые технологии – глобализация» . docs.microsoft.com . 31 января 2022 г.

[1]

[2]

[3]