IE9 で @font-face ルールでフォントが表示されないのはなぜですか?

IE9 での @font-face 表示の問題

@font-face ルールにより Internet Explorer でフォントが表示されないという問題が発生しています。 9 (IE9) は、IE8 を含む他のブラウザでも動作します。さらに、フォントはローカルで表示すると表示されますが、Web サイトがライブでホストされている場合は表示されません。

問題の Web サイトは 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 は他のブラウザーが使用する .eot バージョンではなく、.woff バージョンのフォントを使用しているように見えることです。これにより、.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 で正しく表示されることを保証できます。

以上がIE9 で @font-face ルールでフォントが表示されないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。