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

我的iconfont中的字形（在我的页脚导航中的自定义Web字体）在iPhone上查看时未显示。这是iOS 6.1.4Iconfont/webfont在iPhone safari浏览器中未显示

任何想法为什么发生这种情况，以及如何解决它？

这里是在页脚中的图标不显示截图： enter image description here

Here is a link的页面，这种情况正在发生

来源

2013-05-12 IMUXIxD

我有一种感觉，它与图标上的动画有关。如果您删除动画，它们会出现吗？ – Jackson 2013-05-13 00:07:44

@杰克逊你是说动画没有完全支持，所以他们隐藏的图标？我删除了页脚中图标的动画，但仍未显示。如果你想检查它，它会被更新。 – IMUXIxD 2013-05-13 00:25:46

也许这是font-feature-settings css属性？ IOS的Safari浏览器只有部分支持： http://caniuse.com/font-feature – Jackson 2013-05-13 00:40:10

的问题是，IOS提供了字体功能 - 部分支持设置CSS属性，但您可以在iOS Safari中使用连字添加text-rendering: optimizeLegibility。以下链接（http://clagnut.com/sandbox/opentype/ligatures）显示使用字体洋红色与普通的文字&任意连字ON和其他文字与普通&任意连字关闭。

如果您从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;

本的jsfiddle的从iPhone的屏幕截图：

enter image description here

来源

2013-05-20 22:41:54 PoseLab

谢谢提供详细信息，所以它说它支持连字，但只支持他们部分，并不足以支持他们？ – IMUXIxD 2013-05-21 12:18:36

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

来源

2013-05-21 10:53:46

啊，这样我的脚本行是评估为真，连字显示，但他们不支持？ – IMUXIxD 2013-05-21 12:17:33

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

回答

相关问题