我知道這是一個常見問題，我嘗試了幾乎所有可以找到的解決方案，我想知道是否顯示一些代碼會更有用。我們試過的IE字體問題和解決方案

問題

我想爲客戶端實現4個字體面。當前文件已經用字體松鼠生成。但是，字體對於IE 7/8根本不起作用，部分用於IE9。

字體本身的跨瀏覽器渲染在這裏不是問題，我只是想讓它顯示出來。

我們已經試過

我們花了（在我的工作的公司）有很多做以下時間：
- 我們找到多個語法，字體鼠籠一個是更完整。
- 在加載頁面幾秒後重新加載JavaScript中的CSS（爲舊項目工作）。
- 檢查所有的語法問題。
- 檢查，如果有一個404錯誤
- 把相同的名稱，但witfh不同的字體重量
- 嘗試添加#iefix和特定格式使用

截圖

enter image description here

？

示例代碼

您可以在現場看到：http://dev.phin.fr/fontsie/

語法

@font-face { 
      font-family: 'DidotBoldItalic'; 
      src: url('fonts/DidotHTF-24BoldItalic.eot'); 
      src: url('fonts/DidotHTF-24BoldItalic.ttf') format('truetype'), url('fonts/DidotHTF-24BoldItalic.svg') format('svg'); 
      font-weight: normal; 
      font-style: normal; 
     }

謝謝！

來源

2013-01-16 Séraphin Hochart

我冒昧地下載了您示例中的所有文件和代碼。

我注意到，你缺少的«本地（‘☺’）»在你的CSS聲明屬性，看看第三行下面的例子中：

@font-face { 
    font-family: 'SofiaProBold'; 
    src: url('Sofia-Pro-Bold.eot'); 
    src: local('☺'), url('Sofia-Pro-Bold.ttf') format('truetype'), url('Sofia-Pro-Bold.svg') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

你可以看到導致在IE8（個人電腦）在http://imageftw.com/uploads/20130116/font-fix.png

這個小技巧解決了索菲亞字體的問題，但不幸的是，不適用於Didot字體。我可以假設字體原本不是網絡字體，或者擁有版權和字體松鼠無法轉換它。

以下是我的個人意見。

使用字體時，請嘗試將所有@ font-face聲明放在CSS文件中，該文件位於包含所有字體文件的同一目錄中，然後將此CSS文件鏈接到文檔的<head>。

實施例：

/fonts/myfont/myfont.css « add to the document's <head> 
/fonts/myfont/myfont.woff 
/fonts/myfont/myfont.eot 
/fonts/myfont/myfont.ttf 
/fonts/myfont/myfont.svg

這不僅使更容易地找到所施加的@字體面也將避免url('myfont/font.ttf')屬性內使用相對/絕對路徑。

來源

2013-01-16 20:13:32 EOZyo

完美！它正在使用IE7和IE8。由於某種原因，仍然無法在IE9中進行渲染（可能是授權/損壞問題），但是我使用了另一種字體！留言Merci！ –

請到這裏：http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

IE 6,7和8將無法正常工作。每種瀏覽器呈現字體之間的不一致是一個衆所周知的問題。在我看來，基於你的屏幕截圖 - 現代瀏覽器正在擺脫希望。所有基於webkit的瀏覽器（safari，chrome和opera）在渲染時應該比firefox或ie 9更接近彼此。

來源

2013-01-16 19:15:39 cliffbarnes

謝謝！渲染不是問題（它是，但現在並不重要）。 font-face正在爲這些版本的IE上的其他字體工作。 –

我們試過的IE字體問題和解決方案

問題

我們已經試過

截圖

示例代碼

語法

回答

相關問題