Пользователи, которые не установили шрифт на машине, не видят его на веб-сайте

Question

У меня этот модный сайт Я работаю над: https://omnitored.000webhostapp.com/ Проблема в том, что только люди, у которых есть шрифт, установленный на их машине, могут видеть это на веб-сайте, иначе оно появляется как Arial.

Вот как это выглядит для меня, как у меня установлен шрифт:

И вот как это выглядит для тех, кто не имеет шрифт, установленный:

Кроме того, мой код css, который обозначает шрифт:

@font-face { 
    font-family: infierno; 
    src: url(../fonts/infierno.ttf), 
    url(../fonts/infierno.eot), 
    url(../fonts/infierno.woff); 
} 

Я уверен, что все имена и линки ks в файле верны, поскольку он работает для меня как на хосте, так и на локальных файлах.

Answer 1

src с ошибкой в ​​вашем коде CSS. Кроме того, где находится файл шрифта, расположенный по отношению к файлу CSS? Если папка fonts находится в вашем корневом каталоге, вам нужно будет изменить свойство src, чтобы перейти в одну папку, прежде чем входить в папку fonts.

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

EDIT: Я получил его на работу, используя эту @font-face декларацию в Google Chrome. Дайте мне знать, если это сработает и для вас.

@font-face { 
    font-family: infernio; 
    src: url(../fonts/infierno.ttf), 
     url(../fonts/infierno.woff), 
     url(../fonts/infierno.eot); 
} 

Answer 2

Добавить сильфонные .eot и .wof шрифты также NEER .ttf. и убедитесь, что ваши шрифты загружены в ваш браузер, проверив вашу консоль dev.

@font-face { 
 
    font-family: 'infierno'; 
 
    src: url('../fonts/infierno.ttf'); 
 
    src: url('../fonts/infierno.eot'); 
 
    src: url('../fonts/infierno.wof'); 
 
}