2012-03-02 Обновлено 2023-11-05 css Edit on GitHub

CSS: как использовать кастомные шрифты

Узнайте, как использовать кастомные шрифты в CSS3 через правило @font-face: примеры синтаксиса и демо.

Автор: Marius Bughiu · 1 мин на чтение · 2012-03-02

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

@font-face {
    font-family: someFont;
    src: url('path/font.ttf');
}

Так вы объявляете шрифт для использования на странице. Пример:

@font-face {
    font-family: CODEBold;
    src: url('../fonts/CODEBold.otf');
}

Теперь, чтобы применить кастомный шрифт к тексту, используйте свойство font-family:

<h1 style="font-family: CODEBold">Start Debugging</h1>

Отличный источник кастомных шрифтов - dafont.com Демо здесь: Custom Fonts Demo

Comments