Mengapa Fon Peraturan @font-face Saya Tidak Dipaparkan dalam IE9?

Isu Paparan @font-face dalam IE9

Anda mengalami masalah dengan peraturan @font-face yang tidak memaparkan fon dalam Internet Explorer 9 (IE9), walaupun ia berfungsi dalam pelayar lain, termasuk IE8. Selain itu, fon kelihatan apabila dilihat secara setempat, tetapi bukan apabila tapak web dihoskan secara langsung.

Tapak web yang dimaksudkan ialah bigwavedesign.co.uk/gcc/gcc/ dan kod CSS yang digunakan untuk @font -peraturan muka ialah:

<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>

Nampaknya, isu ini tidak kelihatan seperti kes terpencil, kerana yang lain telah melaporkan masalah yang sama. Perbezaan utama antara IE9 dan penyemak imbas lain ialah IE9 nampaknya menggunakan versi .woff fon dan bukannya versi .eot yang digunakan oleh penyemak imbas lain. Ini membawa kepada penyelesaian di mana versi .woff disertakan dalam projek, menyebabkan fon berfungsi dengan betul dalam semua versi IE.

Peraturan @font-face yang diubah suai berikut termasuk versi .woff dan dilaporkan kepada selesaikan isu:

<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>

Dengan memasukkan versi .woff dalam peraturan @font-face, adalah mungkin untuk memastikan fon dipaparkan dengan betul dalam IE9 sambil mengekalkan keserasian dengan penyemak imbas lain.

Atas ialah kandungan terperinci Mengapa Fon Peraturan @font-face Saya Tidak Dipaparkan dalam IE9?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!