Webfont Trade Gothics 在 IE8 中不起作用答案

【问题标题】：Webfont Trade Gothics not working in IE8Webfont Trade Gothics 在 IE8 中不起作用
【发布时间】：2013-09-20 11:31:32
【问题描述】：

我有这段代码是为了让 webfonts 在每个浏览器中都能正常工作：

@font-face {
    font-family: 'TradeGothic-BoldCondensedNo20';
    src: url('../fonts/tradegothic/trade-gothic-lt-std-bold-condensed-no-20.eot?')  format("embedded-opentype"),
         url('../fonts/tradegothic/trade-gothic-lt-std-bold-condensed-no-20.woff')  format('woff'),
         url('../fonts/tradegothic/trade-gothic-lt-std-bold-condensed-no-20.ttf')  format('truetype');
}

但是，它仍然无法在 IE8 及更早版本中运行。

【问题讨论】：

你试过文件的绝对路径吗？
在fontspring syntax 中他们使用'myfont-webfont.eot?#iefix'，也许#iefix 在这种情况下会有所帮助？
@r3bel 已尝试但结果相同
@jycr753 也适用于这个解决方案，已经尝试过但结果相同

标签： css internet-explorer-8 cross-browser font-face

【解决方案1】：

IE8 不理解 format() 说明符；这是我倾向于使用的 hack：

src: url('../fonts/tradegothic/trade-gothic-lt-std-bold-condensed-no-20.eot');
src: local('☺'),
     url('../fonts/tradegothic/trade-gothic-lt-std-bold-condensed-no-20.eot?')  format("embedded-opentype"),
     url('../fonts/tradegothic/trade-gothic-lt-std-bold-condensed-no-20.woff')  format('woff'),
     url('../fonts/tradegothic/trade-gothic-lt-std-bold-condensed-no-20.ttf')  format('truetype');

IE8 及更早版本将丢弃整个第二条 src 规则，让您（如果运气好的话）可以使用网络字体。

您也可以在第二条src 规则中取出 EOT 行。

【讨论】：

【解决方案2】：

尝试将文件类型添加到 htaccess 中。我不久前遇到了同样的问题，这解决了它...

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff

您可以查看 Addtype here 的文档

【讨论】：

【解决方案3】：

Trade Gothic 不是免费字体。它可用于 MyFonts.com、Linotype.com 和 Fonts.com 上的网络字体许可证。

您使用的似乎是未经授权的版本。如果您为正确的网络字体许可证付费，您将获得带有字体的正确 CSS 字体堆栈，这将解决您的问题。

【讨论】：

这是一个很好的观点，但这类答案可以作为 cmets 发布。从那一刻起，我投了赞成票。