為什麼我的 @font-face 規則無法在 IE9 中顯示字體？

IE9 中的@font-face 顯示問題

您遇到了@font-face 規則在Internet Explorer 中不顯示字體的問題9 (IE9)，即使它們可以在其他瀏覽器（包括IE8）中運作。此外，這些字體在本地查看時可見，但在網站即時託管時不可見。

相關網站是bigwavedesign.co.uk/gcc/gcc/，@font 所使用的CSS 代碼-face 規則是：

<code class="css">@font-face {
  font-family: 'LeagueGothicRegular';
  src: url('league_gothic_0-webfont.eot');
  src: local('League Gothic Regular'), url('league_gothic_0-webfont.woff') format('woff'), url('league_gothic_0-webfont.ttf') format('truetype'), url('league_gothic_0-webfont.svg#webfonta36nFpyE') format('svg');
  font-weight: normal;
  font-style: normal;
}</code>

顯然，這個問題似乎不是孤立的案例，因為其他人也報告了類似的問題。 IE9 和其他瀏覽器之間的主要區別在於 IE9 似乎使用 .woff 版本的字體，而不是其他瀏覽器使用的 .eot 版本。這導致了一個解決方案，其中 .woff 版本包含在專案中，使字體在所有 IE 版本中都能正常運作。

以下修改後的@font-face 規則包含.woff 版本，並報告給解決問題：

<code class="css">@font-face {
  font-family: "LucidaFax-bold";
  src: url("_font/LucidaFax-bold.eot");
  src: local("☺"),
  url("_font/LucidaFax-bold.woff") format("woff"),
  url("_font/LucidaFax-bold.ttf") format("truetype"),
  url("_font/LucidaFax-bold.svg#LucidaFax-bold") format("svg");
  }</code>

透過在@font-face規則中包含.woff版本，可以確保字體在IE9中正確顯示，同時保持與其他瀏覽器的兼容性。

以上是為什麼我的 @font-face 規則無法在 IE9 中顯示字體？的詳細內容。更多資訊請關注PHP中文網其他相關文章！