Свойство font-face

Пример


@font-face {
font-family:heinrich; /* Задаем имя шрифта */
src:url('heinrich.ttf'), /* Указываем местонахождение шрифта в формате .ttf */
url('heinrich.eot') /* Указываем местонахождение шрифта в формате .eot */
}
// Применяем подключенный шрифт к div элементам страницы
div {
font-family:heinrich 
}

Попробовать в редакторе

Быстрый просмотр

Описание

Обратите внимание: данное свойства поддерживается в IE9+, Chrome, Firefox, Opera и Safari.

С помощью @font-face Вы можете подключать к веб-страницам произвольные шрифты.

@font-face является контейнером, который включает в себя различные свойства для описания подключаемого шрифта.

Обратите внимание: IE поддерживает шрифты только в формате .eot, а все остальные браузеры в форматах .ttf и .otf.

Свойства описания шрифта (могут использоваться только внутри контейнера @font-face):

Свойство	Значения	Описание
font-family	имя_шрифта	Указывает имя подключаемого шрифта.
src	url('адрес шрифта')	Указывает адрес расположения файла шрифта.
font-strech	normal condensed expanded	Указывает должен ли шрифт быть растянут (expanded) или сжат (condensed).
font-style	normal italic oblique	Указывает стиль шрифта.
font-weight	normal bold 100 200 300 400 500 600 700 800 900	Указывает толщину шрифта.

« CSS Справочник