@Mak354

Как правильно подключать шрифты через font-face?

В общем, есть макет, в нем разные под шрифты одного шрифта. например Roboto Bold, Roboto Regular и тд, можно ли как то подключить их все в одном правиле font-face и чтоб у них было одно название? А то как то неразумно для каждого шрифта делать свой font-face, свое название. как лучше и правильнее подключать, опишите пожалуйста.
  • Вопрос задан
  • 95 просмотров
Решения вопроса 1
rockon404
@rockon404
Frontend Developer
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100;
    src: url(roboto100Url);
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 200;
    src: url(roboto200Url);
}

/* ... */

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: url(roboto900Url);
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@dsmaslov
Лучшая практика — сначала поискать шрифт на самом компьютере пользователя, чтобы его не загружать повторно и не привлекать дополнительные ресурсы. Делается это, например, так:

@font-face {
  font-family: MyHelvetica;
  src: local("Helvetica Neue Bold"),
       local("HelveticaNeue-Bold"),
       url(MgOpenModernaBold.ttf);
  font-weight: bold;
}
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы