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

редактировать
Свойство CSS в HTML

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

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

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

.text {семейство шрифтов: раз, засечки; размер шрифта: 14pt; стиль шрифта: курсив; }

Образец текста, отформатированного с помощью CSS, в отдельной таблице стилей.

Пример текста, отформатированный с помощью встроенного CSS.

Пример текста, отформатированный с использованием устаревшего тега FONT.

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

.text {font-family: "calibri", Garamond, 'Comic Sans MS'; }

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

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

Общие шрифты

Семейство шрифтов может использовать определенный именованный шрифт (например, Heisei Mincho W9), но результат зависит от шрифтов, установленных на пользовательском компьютере. Фактический внешний вид будет зависеть от браузера и шрифтов, установленных в системе. При установке по умолчанию для Firefox в Microsoft Windows, например, оба шрифта с засечками и Times будут отображаться как Times New Roman, и оба без -serif и Helvetica as Arial.

Обычно только небольшая часть из них, в основном Serif, Sans-serif, Monospace и Cursive, легко настраиваются пользователем в веб-браузерах.

ШрифтПример (вид зависит от установленных шрифтов) [заглавные буквы, предложения, цифры, греческий, арабский, русский]
Agency FB ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
АльбертинаABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Antiqua ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
АрхитекторABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي language
Arial ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
BankFuturisticABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
BankGothicABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Blackletter ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
БлаговестABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Calibri ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Comic Sans MS ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Consolas ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Курьер ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي language
Cursive ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
ДекоративныйABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي language
FantasyABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лиса перепрыгивает через ленивую собаку. 0123456789 αβγ عربي language
Fraktur ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
МорозныйABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Гарамонд ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Джорджия ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Helvetica ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Удар ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лиса перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Миньон ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Современный ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي language
Monospace ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Open Sans ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Палатино ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Perpetua ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Роман ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Без засечек ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Serif ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Script ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Швейцарский ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Тахома ??ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Times ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лиса перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Times New Roman ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
Tw Cen MT ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي language
Verdana ABCDEFGHIJKLMNOPQRSTUVWXYZ Быстрая коричневая лисица перепрыгивает через ленивую собаку. 0123456789 αβγ عربي язык
См. Также
Примечания
  1. ^«Шрифты». W3.org. Проверено 21 сентября 2013.
  2. ^только очень немногие веб-браузеры, включая Konqueror, поддерживают этот
Последняя правка сделана 2021-05-20 10:13:28
Содержание доступно по лицензии CC BY-SA 3.0 (если не указано иное).
Обратная связь: support@alphapedia.ru
Соглашение
О проекте