CSS @font-face 在 IE8 中不起作用答案

【问题标题】：CSS @font-face not working in IE8CSS @font-face 在 IE8 中不起作用
【发布时间】：2013-10-17 18:37:15
【问题描述】：

我尝试阅读多篇关于如何在 IE 中处理自定义字体的文章，但它们似乎对我没有用。我尝试将字体转换为EOT，但这似乎也不起作用。我不确定我做错了什么，所以我会发布我的代码

@font-face {
  font-family: "Klavika Regular";
    src: url('../fonts/klavika.eot');
    src: local('â˜º'), url('../fonts/klavika.woff') format('woff'), url('../fonts/klavika.ttf') format('truetype'), url('../fonts/klavika.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

【问题讨论】：

标签： css font-face

【解决方案1】：

这适用于 ie8/9

http://dev.bowdenweb.com/a/fonts/serif/alegreya/demo.html

@font-face {
    font-family: 'AftaserifRegular';
    src: url('AftaSerifThin-Regular-webfont.eot');
    src: url('AftaSerifThin-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('AftaSerifThin-Regular-webfont.woff') format('woff'),
         url('AftaSerifThin-Regular-webfont.ttf') format('truetype'),
         url('AftaSerifThin-Regular-webfont.svg#AftaserifRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

【讨论】：

【解决方案2】：

如果IE8 认为它支持除eot 之外的任何其他格式，那么它可能会尝试使用那个格式。也许你可以使用 IE8 hack，比如

src: local('â˜º'), url('../fonts/klavika.woff') format('woff'), url('../fonts/klavika.ttf') format('truetype'), url('../fonts/klavika.svg') format('svg');
src /*\**/: url('../fonts/klavika.eot')\9

所以只有 IE8 会读取最后的 src 行，从而加载 .eot。

【讨论】：

【解决方案3】：

在FontSquirrel Generator 上尝试@font-face 的三种CSS 格式（在“专家...”模式> 在“CSS 格式：”>“更多信息”部分）

【讨论】：

【解决方案4】：

值得检查一下您的 .htaccess 文件是否允许该文件类型。

【讨论】：