2013-02-21 2 views
2

Я могу отображать шрифты в хроме, но не в firefox. Мне интересно, если это проблема, потому что я использую фреймворк bootstrap. Вот мой код:@ font-face шрифты в бутстрапе css не отображаются в firefox

@font-face 
{ 
    font-family:"bodyFont"; 
    src: url("http://caseymmiller.com/galapagos/fonts/museosans_300.otf"); 
} 

body 
{ 
    margin: 0; 
    font-family: "bodyFont"; 
    font-size: 15px; 
    line-height: 20px; 
    color: #333333; 
    background-color: #ffffff; 
} 

Кроме того, при загрузке его на мой сервер, только один шрифт теперь появляется в хроме ... и местные источники не работают, так что я удалил его. Я совершенно смущен. http://caseymmiller.com/galapagos/bootstrapInvasive/Invasive.html

Это то, что у меня есть в css сейчас. Я пробовал то, что вы указали раньше, но при поиске обоих URL-адресов для каждого шрифта ни один из них не появится. Вот почему некоторые из них прокомментированы прямо сейчас. Это те источники, которые я хочу использовать с этого момента.

@font-face 
{ 
font-family:"headerFont"; 
src: url("http://livinggalapagos.org/static/Fonts/qhyts__.ttf"); 
/*src: url("http://livinggalapagos.org/static/Fonts/qhyts__.woff");*/ 

} 

@font-face{ 
font-family:"subHeadFont"; 
src: url("http://livinggalapagos.org/static/Fonts/museosans_500.ttf"); 
src: url("http://livinggalapagos.org/static/Fonts/museosans_500.woff"); 

} 

@font-face{ 
font-family:"bodyFont"; 
src: url("http://livinggalapagos.org/static/Fonts/museosans_300.ttf"); 
/*src: url("http://livinggalapagos.org/static/Fonts/museosans_300.woff");*/ 

} 
+0

Подождите, я смущен. Я уже включил формат .ttf. Я изменил линию, чтобы добавить точку с запятой, но все равно не повезло. Это ты имел в виду? url ('fonts/museosans_300-webfont.ttf') format ('truetype'); – user1855009

+0

Я решил, что попытаюсь исправить их локально, но он не работает, поэтому я снова их использовал с помощью URL. – user1855009

+0

Теперь все они появляются как в хроме, так и в сафари. – user1855009

ответ

0

мне интересно, если у вас нет опечатки в 2 свойств?

src: url('fonts/museosans_300-.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
url('fonts/museosans_300-.ttf') format('truetype'), /* Safari, Android, iOS */ 

Если не эти два быть

src: url('fonts/museosans_300-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
url('fonts/museosans_300-webfont.ttf') format('truetype'), /* Safari, Android, iOS */ 

Примечания добавленного WebFont в конце пути к файлам.

Обязательно очистите кеш браузера после внесения этих изменений.

Удачи вам!

Смежные вопросы