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

В HTML и XHTML, CSS семейство шрифтов свойство используется для указания списка приоритетных шрифтов и общих имен семейств; в сочетании с соответствующими свойствами шрифта этот список определяет конкретный шрифт используется для рендеринга персонажей. А семейство шрифтов представляет собой группу шрифтов, определяемых 9 общими стилями дизайна.

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

Атрибут начертания шрифта в сочетании с другими атрибутами представления шрифта может быть применен в HTML с помощью устарел шрифт элемент.

.текст { семейство шрифтов: раз, засечки; размер шрифта:14pt; стиль шрифта:курсив; }
<п класс="текст">Образец текста, отформатированного с помощью CSS, в отдельной таблице стилей.</п><п стиль="font-family: times, serif; font-size: 14pt; font-style: italic">Образец текста, отформатированный с помощью встроенного CSS.</п><п><я><шрифт лицо="times, serif" размер="3">Пример текста, отформатированный с помощью устаревшего тега FONT.</шрифт></я></п>

Лучшая практика для значений семейства шрифтов CSS - разделять значения запятыми и пробелами, помещая значения из нескольких слов в кавычки.

.текст { семейство шрифтов: "калибри", Garamond, "Comic Sans MS"; }

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

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

Общие шрифты

В семейство шрифтов может использовать определенный именованный шрифт (например, Хэйсэй Минчо W9), но результат зависит от шрифтов, установленных на пользовательской машине. Фактический внешний вид будет зависеть от браузера и шрифтов, установленных в системе.[1] А установка по умолчанию из Fire Fox на Майкрософт Виндоус, например, отобразит оба засечки и Раз так как Times New Roman, и оба без засечек и Helvetica так как Arial.

Обычно только небольшая часть из них, в основном «Засечки», «Без засечек», «Моноширинный» и «Курсив».[2] легко настраиваются пользователем в веб-браузерах.

ШрифтПример (вид зависит от установленных шрифтов) [заглавные буквы, предложения, цифры, греческий, арабский, русский]
Агентство FBABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
АльбертинаABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
AntiquaABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
АрхитекторABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ArialABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
БанкФутуристическийABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
БанкГотикаABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
BlackletterABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
БлаговестABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
КалибриABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Comic Sans MSABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ConsolasABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
КурьерABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
КурсивABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ДекоративныеABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ФантазияABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
FrakturABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
МорозныйABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
GaramondABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ГрузияABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
HelveticaABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ВлияниеABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
МиньонABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
СовременноеABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
МоноширинныйABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Open SansABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ПалатиноABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
PerpetuaABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
РимскийABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Без засечекABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ЗасечкиABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
СценарийABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ШвейцарскийABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Тахома  ??ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
РазABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Times New RomanABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Tw Cen MTABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ВерданаABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык

Смотрите также

Примечания

  1. ^ «Шрифты». W3.org. Получено 2013-09-21.
  2. ^ только очень мало веб-браузеров, включая Konqueror, поддержите это