Возможно кому-нибудь пригодится)

Частенько мне встречаются на различных форумах вопросы о том, как добавить на страничку шрифты, которых нет у других пользователей на компьютере.
Решение этого вопроса довольно простое. Давайте рассмотрим все по порядку.

Определение нового шрифта задается директивой @font-face:


Базовые дескрипторы шрифта, указываемые в специальной директиве, соответствуют шрифтовым свойствам CSS2 и принимают те
же значения, что и эти свойства. А именно вы можете указывать дескрипторы:

• font-family
• font-style
• font-variant
• font-weight
• font-stretch
• font-size

и их допустимые значения, чтобы определить новый шрифт. Например:


Здесь определяется шрифт AE Font, который можно загрузить с сайта aeweb.ru. Для этого шрифта доступны обычная версия и курсив.
Т.к. другие дескрипторы не указаны, браузер будет предполагать, что остальные свойства шрифта (жирность и т. д.) определяются в самом шрифте.

Короче говоря, отсутствие какого-либо дескриптора позволяет браузеру брать для соответствующего свойства любое значение.

Указывая одно или несколько значений дескриптора шрифта, ограничивается набор допустимых значений. Поэтому, при определении шрифта, следует быть конкретнее, чтобы браузер сделал оптимальный выбор. Например, если у шрифта нет курсивной версии и вы ничего не предложите браузеру, он может использовать неподходящий шрифт, когда встретит запрос на курсив для этого шрифта.

Значением свойства src может содержать и список элементов через запятую.

В приведенном выше, можно было написать:


Это значит, что если по адресу http://www.aeweb.ru/aefont.ttf будет недоступен шрифт, то нужно брать значение с компьютера пользователя.

Также браузеру можно подсказать, какой формат шрифта используется. Делается это так:


Ну вот и все.

Замечание модератора: Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней. Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой или обратитесь к любому из модераторов.