Maqsat
@Maqsat
либерал в программировании

Один и тот же шрифт, разный в разных компьютерах (не браузерах, в одном компьютере все браузеры показывають одинакова), почему?

@font-face {
    font-family: "OpenSansRegular";
    src: url(../fonts/open-sans/OpenSans-Regular.ttf);
}
@font-face {
    font-family: "OpenSansLight";
    src: url(../fonts/open-sans/OpenSans-Light.ttf);
}

body{
    font-family: "OpenSansRegular","Arial";
}


На моем компьютере и на компах моих коллег(microsoft , mac os ,Chrome,Mozilla) отображается нормально шрифт OpenSans
a у клиента(Windows ,Chrome) почему то отображается шрифт New Times Roman
  • Вопрос задан
  • 3131 просмотр
Решения вопроса 1
nastyamyaots
@nastyamyaots
Надо произвести генерацию шрифта через сервисы-генераторы шрифтов типа www.fontsquirrel.com/tools/webfont-generator или fonts4web.ru
Там находите нужный Вам шрифт или как с первым сервисом можете загрузить свой шрифт, затем полученные файлы шрифтов с разными расширениями загружаете на сервер в папку fonts (ну, или туда, где удобно), а в файл css переносите код типа того, что написан в ответе выше от Sergey Goryachev.

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

Кстати, шрифты также можно подключать с помощью сервиса от google https://www.google.com/fonts
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
webirus
@webirus
Тыжверстальщик! Наверстай мне упущенное...
Используйте расширенную конструкцию подключения шрифта.
Вероятно, у вас (на вашем компе и компе коллеги) Опен Санс установлен в систему.
@font-face {
    font-family: 'neosanspro_bold';
    src: url('../fonts/neosanspro_bold.eot');
    src: url('../fonts/neosanspro_bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/neosanspro_bold.woff2') format('woff2'),
         url('../fonts/neosanspro_bold.woff') format('woff'),
         url('../fonts/neosanspro_bold.ttf') format('truetype'),
         url('../fonts/neosanspro_bold.svg#neosanspro_bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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