Iconfont / webfont没有在iPhone Safari浏览器中显示

Question

我的页脚导航中的自定义网络字体iconfont中的字形在iPhone上查看时无法显示。它是iOS 6.1.4

知道为什么会发生这种情况以及如何解决这个问题？

以下是未显示页脚中图标的屏幕截图：

Here is a link到发生这种情况的页面

Answer 1

问题在于IOS为font-feature-settings CSS属性提供了部分支持，但您可以在iOS Safari中添加text-rendering: optimizeLegibility使用连字。以下链接（http://clagnut.com/sandbox/opentype/ligatures）显示使用字体Magenta with Common＆amp; amp;酌情连字ON和其他文字与Common＆amp;酌情连结OFF。

如果您从iOS设备访问此链接，您将看到两个文本相同。这意味着iOS不支持仅与font-feature-settings的连字，这就是为什么排版中的陀螺不适用于iOS。

要使其在iOS中运行，您必须将text-rendering: optimizeLegibility添加到您的CSS中。一个很好的参考可能是"Tomorrow’s web type today: The fine flourish of the ligature"。但是，您应该阅读"Is it safe to use the CSS rule “text-rendering: optimizelegibility;” on all text?"。

您可以在以下链接中找到适用于iOS的字体示例：

http://jsfiddle.net/poselab/TQjgC/

text-rendering: optimizeLegibility;

来自iPhone的这个jsfiddle的截图：

Answer 2

删除if((Modernizr.prefixed("fontFeatureSettings"))中的noLigatures.js。图标将显示在iOS6中。