2012-02-14 4 views
3

Я пытаюсь этот кодом для @fontface для арабского шрифта:CSS3 @fontface не работает с Chrome 17 и Firefox 10

@font-face { 
font-family: 'MothnnaFont'; 
src: url('fonts/mothnna.eot'); /* IE9 Compat Modes */ 
src: url('fonts/mothnna.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
    url('fonts/mothnna.woff') format('woff'), /* Modern Browsers */ 
    url('fonts/mothnna.ttf') format('truetype'), /* Safari, Android, iOS */ 
    url('fonts/mothnna.svg#svgMothnnaFont') format('svg'); /* Legacy iOS */ 
} 

Я использую шрифт в классе под названием демо:

.demo 
{ 
    font-family:'MothnnaFont',Sans-Serif; 
    width:800px; 
    margin:10px auto; 
    text-align:center; 
    border:1px solid #666; 
    padding:10px; 
    direction: rtl; 
} 

Этот код работает на IE, но он не работает на Firefox 10 или хром 17

Вот демо http://tmr.hyperphp.com/font/demo.html

Вот как шрифт должен выглядеть

enter image description here

Так кто-нибудь может помочь мне сделать этот шрифт появится крест все браузеры?

Решено: просто скачал шрифт и превратили его снова и все это работает в настоящее время спасибо всем за помощь

+0

Возможно, использование двух 'src:'? Попробуйте ',' вместо '; src:'. – 0b10011

+0

Пробовал, но не работал –

+0

Вы уверены, что путь верный? Все остальное выглядит так, как будто это правильно. –

ответ

1

Этот синтаксис встраивания веб-шрифты не пуленепробиваемый больше. Попробуйте использовать синтаксис Fontspring вместо:

@font-face { 
    font-family: 'MothnnaFont'; 
    src: url('fonts/mothnna.eot?#iefix') format('embedded-opentype'), 
     url('fonts/mothnna.woff') format('woff'), 
     url('fonts/mothnna.ttf') format('truetype'), 
     url('fonts/mothnna.svg#svgMothnnaFont') format('svg'); 
} 

Это только первый двойной внешний вид «ЦСИ» вы должны атрибута по исправить.

Это позволит решить вашу проблему.

Дополнительную информацию о синтаксисе см. Здесь source. И, кстати, fontsquirrel также использует этот синтаксис по умолчанию.

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