Iconfont / webfont未显示在iPhone safari浏览器中

Question

在iPhone上查看时，我的图标字体(页脚导航中的自定义web字体)中的字形不会显示。它是iOS 6.1.4

你知道为什么会发生这种情况以及如何修复它吗？

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

​

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

Answer 1

问题是，IOS提供了对字体功能设置CSS属性的部分支持，但您可以在添加text-rendering: optimizeLegibility的iOS Safari中使用连字。下面的链接(http://clagnut.com/sandbox/opentype/ligatures)显示了一个使用洋红色字体的文本，其中打开了常用和自由连字，而其他文本则关闭了常用和自由连字。

如果您从iOS设备访问此链接，您将看到两个文本是相等的。这意味着iOS不只支持font-feature-settings的连字，这就是为什么您的排版中的gyphs在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

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