33

我嵌入了来自http://www.google.com/webfonts的三种 Google 字体（Dosis、Open Sans、Lato）

除了返回的 IE9 之外，它们都可以正常工作：

CSS3111: @font-face encountered unknown error. 
2HG_tEPiQ4Z6795cGfdivPY6323mHUZFJMgTvxaG2iE.eot

CSS3111: @font-face encountered unknown error. 
KlmP_Vc2zOZBldw8AfXD5g.eot

CSS3111: @font-face encountered unknown error. 
zLhfkPOm_5ykmdm-wXaiuw.eot

并且偶尔会破坏整个网站。

可以做些什么来解决这个问题？

4

7 回答 7

27

我找到了这个答案，它比公认的答案更直接地解决了这个问题，这真的不应该是答案:)

现在是我们的主要亮点 - “CSS3111：@font-face 遇到未知错误”。这个错误非常模糊。如果您再次查看 MSDN，您会看到它的描述说：“级联样式表 ( 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-错误/

于 2012-12-30T16:39:38.397 回答
5

我使用以下方法解决了 IE 9 上的问题@font-face：

@font-face {
    font-family: Gidole;
    src: url('Gidole-Regular.woff2') format('woff2'),
         url('Gidole-Regular.woff') format('woff');
}
于 2016-10-09T08:11:46.897 回答
3

我们发现，由于新的 Windows 10 策略，您会遇到相同的错误。如果您的错误发生在 Windows 10 + IE11 上，解决方案可以是：

IE 11：我自己的代码中出现错误 CSS3111，并且 google.com/fonts 不呈现任何字体

于 2017-01-27T13:22:31.870 回答
1

注释掉 EOT 字体的第二个源声明对我有用。确保您在“src: url("../fonts/webfonts/Helvetica Neue.eot");”上方的第一个声明

在 Chrome、Firefox、Sarafi、IE9-10-11 上测试。

@font-face {
  font-family: 'Helvetica Neue';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/webfonts/Helvetica Neue.eot");
  src: local("Helvetica Neue"), local("Helvetica Neue"),
    /*url("../fonts/webfonts/Helvetica Neue.eot?#iefix") format("embedded-opentype"),*/
    url("../fonts/webfonts/Helvetica Neue.woff2") format("woff2"),
    url("../fonts/webfonts/Helvetica Neue.woff") format("woff"),
    url("../fonts/webfonts/Helvetica Neue.ttf") format("truetype"),
    url("../fonts/webfonts/Helvetica Neue.svg") format("svg"); }
于 2017-07-17T17:33:32.827 回答
0

当您使用desubroutinize d 字体时，也会发生此错误，似乎没有任何版本的 Internet Explorer 能够处理。

如果您使用fonttoolspyftsubset包生成字体文件，请确保您没有设置标志。--desubroutinize

于 2017-09-29T16:12:01.683 回答
0

我在 IE11 中遇到了同样的问题，我通过将字体文件.woff2从.woff.

通常，请确保浏览器支持字体文件格式。

于 2020-03-24T15:38:10.763 回答
-1

希望以下说明对您有用：

如果您的字体位于远程服务器（例如 CDN）上，它们将无法在所有浏览器中正确呈现。这只是部分正确。是的，如果没有明确的“Access-Control-Allow-Origin”标头，Firefox 和 Internet Explorer 将不会显示您的网络字体（如果您按 F12 在 IE 中打开开发人员工具并转到控制台选项卡，您将获得 CSS3117 : @font-face 跨域请求失败。资源访问受限。错误）那只是因为 IE 和 Firefox 默认不允许跨域字体。另一方面，谷歌浏览器将毫无问题地加载字体，如果您不知道跨域问题，调试这可能会非常令人沮丧。虽然我个人也更喜欢将我的字体放在同一个域上，

<FilesMatch "\.(ttf|otf|eot|woff)$">
      <IfModule mod_headers.c>
          Header set Access-Control-Allow-Origin http://mydomain.com"
      </IfModule>
</FilesMatch>

请参阅参考资料

于 2012-07-19T11:19:13.333 回答