3

我在 IE9（Windows 7）上遇到了 @font-face 的问题。XP 上的 IE 8 和 mac 上的所有浏览器都没有问题。只有IE9。

我像这样嵌入我的字体：

@font-face {
    font-family: 'wendy_lpregular';
    src: url('../fonts/wendylpstd-medium.eot');
    src: url('../fonts/wendylpstd-medium.eot?#iefix') format('embedded-opentype'),
         url('../fonts/wendylpstd-medium.woff') format('woff'),
         url('../fonts/wendylpstd-medium.ttf') format('truetype'),
         url('../fonts/wendylpstd-medium.svg#wendy_lpregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

它不呈现字体并在控制台中给我以下错误：

CSS3111: @font-face encountered unknown error. 
wendylpstd-medium.eot

我有另一种要嵌入的字体 - 它显示正确。是什么导致了不起的 IE9 为这个哭泣？

4

3 回答 3

2

现在是我们的主要亮点 - “CSS3111：@font-face 遇到未知错误”。这个错误非常模糊。如果您再次查看 MSDN，您会看到它的描述说：“Cascading Style Sheets ( CSS）字体”。“未知问题”对我来说听起来不太好——我应该如何解决未知问题？幸运的是，我们在这里得到了提示。它说：“检查字体的来源”。实际上，CSS3111 通常是由字体的二进制源问题引起的。例如，流行的在线 TTF 到 EOT 转换器之一会生成带有不符合 Microsoft 标准的 NAME 表的 EOT 文件，这导致 EOT 字体永远不会在 IE 中加载并产生 CSS3111 错误。因此，当您体验 CSS3111 时，尝试使用不同的 TTF 到 EOT 转换器或字体生成器总是好的。

资料来源： http: //www.marinbezhanov.com/web-development/16/how-to-embed-webfonts-properly-and-how-to-solve-the-ambiguous-css3111-font-face-encountered-unknown-错误/

于 2013-04-12T14:39:58.380 回答
1

您必须将字体转换为 base64。

  1. 使用这个小提琴将你的woff字体文件转换为 base 64。

  2. 在 CSS 文件中使用第 1 步的输出，如下所示：

    src: url(data:application/x-font-woff;charset=utf-8;base64, [base 64 value from step 1 without brackets] ) format('woff');

最终结果将如下所示，其中your base64是第 1 步的值： WebFont 包含示例

祝你好运！

于 2014-02-19T15:08:13.013 回答
0

尝试使用简单的线条在您的 css 中定义 font-face，并使用绝对 urls，例如

@font-face{
    font-family:'wendy_lpregular';
    src:url('your-web.com/fonts/wendylpstd-medium.eot');
    src:url('your-web.com/fonts/wendylpstd-medium.eot?#iefix') format('embedded-opentype'),
    url('your-web.com/fonts/wendylpstd-medium.woff') format('woff'),
    url('your-web.com/fonts/wendylpstd-medium.ttf') format('truetype'),
    url('your-web.com/fonts/wendylpstd-medium.svg#GothamRM') format('svg')
}

检查是否可以在 IE 中打开文件（your-web.com/fonts/wendylpstd-medium.woff），如果收到错误 404 转到 IIS，请在选择 IIS 根节点的同时双击“MIME 类型”配置选项在左侧面板中，然后单击右侧“操作”面板中的“添加...”链接。这将弹出以下对话框。添加.woff文件扩展名并指定“ application/x-font-woff ”作为对应的 MIME 类型

我在这个网站（Robòtica educativa ）中使用了这个指令，我在（ http://www.font2web.com/）上转换了我原来的 .ttf 字体

于 2013-04-19T08:33:08.863 回答