首頁 > web前端 > css教學 > 為什麼我的 @font-face 無法在 IE9 的即時網站上運行?

為什麼我的 @font-face 無法在 IE9 的即時網站上運行?

Barbara Streisand
發布: 2024-11-01 11:44:02
原創
718 人瀏覽過

Why is My @font-face Not Working in IE9 on a Live Site?

在IE9 中調試@font-face 問題

儘管@font-face 在IE8 和其他瀏覽器中可以無縫運行,但在IE9 中卻遇到了顯示困難。此問題專門出現在即時網站上,而在使用者電腦上本地查看不會出現任何問題。

有問題的 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;
}
登入後複製

已報告類似問題,該字體可在除 IE9 之外的所有 IE 版本中使用。然而,更改文件模式(透過 F12 開發者工具)可以解決該問題,儘管效果並不理想。

更新:

調查顯示 IE9 使用 .woff字體變體而不是預期的 .eot 版本。透過包含由fontsquirrel @font-face 生成器產生的完整字體變體並使用笑臉本地技術,問題已解決:

@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");
  }

h1 { font-family: "LucidaFax-bold", serif;}
登入後複製

此外,Mark “Tarquin” Wilton-Jones 文字- Shadow hack 已被用來在IE 版本之間實現一致的視覺樣式。

以上是為什麼我的 @font-face 無法在 IE9 的即時網站上運行?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板