2012-08-07 58 views
1

@font-face{ font-family: gotham; src: url('../fonts/Gotham-Light.otf'); } 我在我的css文件中包含了名爲Gotham的字體。它在Mozilla和所有其他瀏覽器中工作,但不在IE9中工作。css font-face在IE中不工作

+0

你的問題是不是很豐富....是你的問題相關http://stackoverflow.com/questions/5587956/make-adobe-fonts-work-with-css3-font-face-in-ie9? – fvu 2012-08-07 09:40:20

+0

@ font-face需要幾種不同的字體格式(由不同的瀏覽器支持);您可以使用http://www.fontsquirrel.com/fontface/generator來生成不同的文件。 – darma 2012-08-07 09:41:46

+0

@ ramshinde1992:詳情請參閱下面的答案。 – 2012-08-07 09:51:29

回答

2

The New Bbulletproof Fontface Syntax

@font-face { 

     font-family: 'MyFontFamily'; 
     src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'), 
      url('myfont-webfont.woff') format('woff'), 
      url('myfont-webfont.ttf') format('truetype'), 
      url('myfont-webfont.svg#svgFontName') format('svg'); 
    } 

它是如何工作的?

Internet Explorer < 9在src屬性的解析器中存在一個錯誤。如果您在src中包含多種字體格式,則IE無法加載它並報告404錯誤。原因是IE試圖加載文件中的所有內容,直到最後一個右括號。爲了處理這種錯誤的行爲,你只需首先聲明EOT並附加一個問號。問號讓IE認爲字符串的其餘部分是查詢字符串,並加載EOT文件。其他瀏覽器遵循規範並根據src級聯和格式提示選擇他們需要的格式。

瀏覽器兼容性:

的Safari 5.03,IE 6-9,火狐3.6-4,鉻8的iOS 3.2-4.2,機器人2.2-2.3,歌劇11

要生成您的字體套件,您應該使用fontsquirrel