Question

为什么我使用的webfont，对于页脚中的图标，显示何时在iOS 6.1.4中查看此站点？

我尝试删除图标上的CSS动画，删除它上面的jQuery。什么都没有让他们展示。

我非常感谢任何帮助，找出为什么这个字体没有显示。

Answer 1

请看一下这个链接：

Iconfont / webfont not showing in iPhone safari browser

问题是iOS为font-feature-settings CSS属性提供了部分支持，但您可以在iOS中使用连字 Safari添加文本呈现：optimizeLegibility。以下链接（http://clagnut.com/sandbox/opentype/ligatures）显示使用的文本字体洋红色与普通＆amp;自由选择的连字和其他文本与普通＆amp;酌情连结OFF。如果您访问此链接从iOS设备，您将看到两个文本是相同的。这意味着 iOS不支持仅使用font-feature-settings的连字这就是为什么你的排版中的gyphs在iOS上不起作用的原因。至使它在iOS中工作，你将不得不添加文本呈现：优化CSS的可读性。一个很好的参考可能是“明天的今天的网络类型：结扎的精美蓬勃“。但是，你应该阅读“使用CSS规则是否安全”文本呈现： optimizelegibility;“on all text？”。
 text-rendering: optimizeLegibility;

Answer 2

您可以删除SVG格式。添加它的唯一原因是在iOS 4.2之前，Mobile Safari不支持TrueType字体格式。从iOS 4.2开始，它原生支持TrueType格式的字体。由于此更新发生在2010年11月，我怀疑有很多用户使用旧版本。

http://www.zeldman.com/2010/11/26/web-type-news-iphone-and-ipad-now-support-truetype-font-embedding-this-is-huge/

Answer 3

我使用不同的符号字体部分重新创建了您的页面，并在iOS上确认了相同的功能错误。我能够在iOS上渲染符号字体进行此更改：

<li><a class="" href="#">Mail</a></li>

更改为

<li><a class="ss-mail" href="#"></a></li>

我正在使用symbolset，因为我已经拥有所有字体文件的副本，但功能错误类似。在symbolset的情况下，使用您的代码行实际上显示了“＆＃39; Mail＆＃39;符号应该在iOS上，而符号字体在桌面浏览器上正确呈现。当我将代码切换为使用类名时，该符号适用于iOS。

此处有a link to my example符号字体在iOS上工作（注意：我没有花时间让所有其他字体和javascript工作）。

也许你的字体在iOS上渲染符号时有类似的问题。如果有另一种方法来应用字体，可以通过类似于symbolset的CSS类来尝试，看看你是否得到了相同的结果。如果不是，您可以始终使用符号集或不同的符号字体。

Answer 4

我认为对此的“真实”答案是：您的网络服务器上的字形字体为404'（当您在设备上进行测试时）。

在你的CSS中，你有'../fonts/glyphs.eot'，它是：http://irfandesign.com/fonts/glyphs.eot（并且是404'）。

Answer 5

我建议删除谷歌网络字体并使用css3的@ font-face，支持就足够了（http://caniuse.com/fontface），它适用于iOS浏览器等。此外，还有大量免费的网络友好那里使用的字体（并非所有字体看起来像shite - 做一些激烈的谷歌搜索）。不要忘记检查他们的许可证，以确保他们有适当的许可证嵌入网站。

这是@ font-face css的演示：

@font-face {
font-family: 'MyFontFamily';
src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'), 
     url('myfont-webfont.woff') format('woff'), 
     url('myfont-webfont.ttf')  format('truetype'),
     url('myfont-webfont.svg#svgFontName') format('svg');
}

然后在页面上使用它

body {
    font: bold 1em/1.5em 'MyFontFamily', Arial, Helvetica, Geneva, sans-serif;
}

然后你就定了。

Webfont没有在iOS中显示

5 个答案: