Question

我正在使用CDN中的Font Awesome：

<link rel="stylesheet"
    href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"
>

在桌面浏览器上，它运行良好。但是在iOS Safari浏览器（iOS 9）上，图标不会渲染，并且全部被正方形替换。

我将iPad连接到Mac，启动了开发人员工具，并注意到iOS浏览器尝试从我自己的服务器而不是CDN下载字体文件。

例如，CDN上的CSS文件包含以下行：

@font-face{
    src:url('../fonts/fontawesome-webfont.eot?v=4.4.0');

但iOS Safari将其解析为：

GET http://mywebsite.com/fonts/fontawesome-webfont.eot?v=4.4.0

据我所知，在CSS中，相对路径是相对于CSS文件的位置而不是当前页面的位置。

这是iOS Safari中的（已知？）错误吗？有修复吗？

赞赏任何指针。

Answer 1

不确定问题究竟在哪里，但升级到iOS 9.2和Font Awesome 4.5.0似乎已经解决了我的问题。

我仍然有一个问题，因为图标出现了一秒然后消失了。原来这是因为过时的viewport-units-buggyfill.js脚本。升级到0.5.5修复了另一个问题。

Answer 2

您是否尝试在网址前面使用http，就像这样？

<link rel="stylesheet"
href="http://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">