IE11嵌入式字体将不起作用 - 尝试所有常用的方法 [英] IE11 embedded font won't work - tried all the usual approaches

问题描述

我有一套嵌入式字体可以在Firefox，Chrome，Safari中正常工作 - 但是，令人吃惊的是，没有在IE浏览器（v11，但在10试过，也没有任何效果）。 b
$ b

我可以在IE中加载一些，而不是其他的。 css样例：

$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ 'FoundersGroteskWeb-Semibold';
src：url（./ fonts / FoundersGroteskWeb-Semibold.eot）;
src：url（./ fonts / FoundersGroteskWeb-Semibold.eot？#iefix）format（'embedded-opentype'），
url（./ fonts / FoundersGroteskWeb-Semibold.woff）format（'woff ）;
font-style：normal;
font-weight：normal;

$ b / *不工作* /
@ font-face {
font-family：'FoundersGroteskX-CondensedWeb-Bold';
src：url（./ fonts / FoundersGroteskX-CondensedWeb-Bold.eot）; （./fonts / FoundersGroteskX-CondensedWeb-Bold.woff）格式（'embedded-opentype'），
src：格式（ 'WOFF'）;
font-style：normal;
font-weight：normal;
}

提供的字体全部正确命名等等。所有其他浏览器加载的WOF文件，而IE浏览器正在使用（第一，非#iefix）EOT文件。所以我试着删除所有对eot文件的引用，迫使IE11使用woff。再次，它加载了第一个罚款，但没有使用第二个（所有其他浏览器加载都没有问题）。

当我检查网络选项卡在IE上，我可以看到第一个字体的200响应，但是对于第二个字体没有任何意义，看起来像是在css的解析中可能会窒息。然而，鉴于这两个声明是相同的字体名称除外，我不明白为什么可能是。

任何人有什么想法我可以尝试，因为我已经用尽了吸管来抓取？解决方案

IE 9（和我认为10和11）以及字体名称声明的31个字符限制。请尝试将您的字体名称重命名为FoundersGroteskX-CndWeb-Bld;这是30个字符，只是为了安全（因为这个31个字符的限制是包括引号和分号。）

I have a set of embedded fonts that work fine in Firefox, Chrome, Safari - but, surprise, surprise, not in IE (v11, but tried in 10 and that didn't work either).

I can get some to load in IE, but not others. Sample of css:

/* working */
@font-face {
    font-family: 'FoundersGroteskWeb-Semibold';
    src: url(./fonts/FoundersGroteskWeb-Semibold.eot);
    src: url(./fonts/FoundersGroteskWeb-Semibold.eot?#iefix) format('embedded-opentype'),
        url(./fonts/FoundersGroteskWeb-Semibold.woff) format('woff');
    font-style: normal;
    font-weight: normal;
            }

/* not working */    
@font-face {
    font-family: 'FoundersGroteskX-CondensedWeb-Bold';
    src: url(./fonts/FoundersGroteskX-CondensedWeb-Bold.eot);
    src: url(./fonts/FoundersGroteskX-CondensedWeb-Bold.eot?#iefix) format('embedded-opentype'),
        url(./fonts/FoundersGroteskX-CondensedWeb-Bold.woff) format('woff');
    font-style: normal;
    font-weight: normal;
}

The fonts are served, all named correctly, etc. One difference I noticed is that all the other browsers were loading the woff file, whereas IE was using the (first, non #iefix) eot file. So I tried deleting all references to the eot files, forcing IE11 to use the woff. Again, it loaded the first one fine, but didn't use the second one (all other browsers loaded both with no problem).

When I check in the network tab on IE, I can see the 200 response for the first font, but there's nothing at all for the second font, looking like it might be choking on the parse of the css. However, given that the two declarations are identical apart from the font name, I can't see why that might be.

Anyone got any ideas what else I can try, because I've run out of straws to clutch at?

解决方案

IE 9 (and I think 10 and 11 as well) have 31 character limit on font face name declaration. Please try and rename your font name to "FoundersGroteskX-CndWeb-Bld"; which is 30 characters, just to be safe (because this limitation of 31 characters is including quotes and semi-colon.

这篇关于IE11嵌入式字体将不起作用 - 尝试所有常用的方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！