18

我有一个测试站点，它使用 Font Awesome 字体来显示图标。

这些图标在我的 IE 和 Chrome 桌面以及 iPhone 和 Andriod 移动设备上都能正常显示。

但是，Nokia Lumia 920 Windows Phone 8 上没有显示字体图标。

我无法弄清楚是什么导致了问题。在诺基亚 Lumia 920 Windows Phone 上正确显示 Font Awesome 图标字体的其他网站。因此，必须有一些特定于我创建的设置的内容。

测试站点为： http ://www-peachtreedata.azurewebsites.net/?page_id=6

任何有关如何使其在 Windows Phone 平台上工作的建议将不胜感激。

4

6 回答 6

7

在这种情况下，观察到的问题只是实际问题的症状。我自己的网站也有同样的问题。但事实证明这不是 Windows Phone 的问题，而是 IIS 7 - 8.1 为 Web 字体文件提供了错误的 MIME 类型。确保为您的字体文件提供正确的 MIME 类型，如下所示：Proper MIME type for fonts

此外，如果您为字体使用 Windows Azure 存储，则必须手动设置每个文件的 MIME 类型。对现有文件执行此操作的最简单方法是通过众多 Azure 存储前端编辑器之一。

高温高压

于 2013-09-17T15:35:29.623 回答
3

我能够使用 base64 让我的字体/图标集被 Windows Phone 8 识别。确保您使用 WOFF 和 TTF 字体，如下所示（其中*是长 base64 字符串）：

@font-face {
    font-family: 'icomoon-ac';
    src: url(data:application/x-font-woff;charset=utf-8;base64,***) format('woff'),
        url(data:application/x-font-ttf;charset=utf-8;base64,***) format('truetype');
    font-weight: normal;
    font-style: normal;
}

更新：这个话题再次出现在 Hacker News 上，所以让我在这里详细说明我的原始帖子，以防它帮助其他人：1）我只尝试了 icomoon，2）我只使用了 1 种嵌入字体。

我使用 jqMobi（现在称为 Intel App Framework）来构建一个针对所有主要移动浏览器的移动网站。jqMobi 框架包含约 70 个来自 icomoon 的图标，嵌入到其 ui CSS 中。我还需要一些，所以我最初尝试通过制作另一个名为 icomoon-extra 的字体文件来扩展它，将其上传到http://www.motobit.com/util/base64-decoder-encoder.asp以生成 base64 字符串并在 jqMobi CSS 中添加另一个 @font-face。这对我不起作用，所以我只是创建了一个新的 icomoon-ac 文件，其中包括来自 jqMobi icomoon 选择的大部分原始图标，以及我需要的另外约 30 个左右的图标。现在，我只是在框架中使用我的 icomoon-ac 字体，它就可以工作了。同样，只有 1 种嵌入字体。

于 2013-05-16T04:32:53.533 回答
2

CSS@font-face在 Windows Phone IE 中不能可靠地工作。

Font Awesome 等图标字体依赖于从远程服务器加载适当的字体文件。@font-face显然，在 Windows Phone 上无法加载额外的字体。根据来源，这仅适用于 Windows Phone 7，甚至适用于版本 8：

  • 微软表示网络字体在 7.1 上不起作用
  • 这个 SO 线程和另一个线程报告了 7.5 的问题，但可能暗示了可能的解决方案
  • 在这篇文章的评论中，据说即使是 Base64 编码的字体也不能在模拟器中工作。如果我有时间，我将在真机（7.5）上进行测试。
  • 即使是modernizr也有一些问题

旁注：在我的 Windows Phone 上，microsoft.com 与 Tahoma 一起显示，这是堆栈中的第二个字体：

 font-family: wf_SegoeUI, Tahoma, Verdana, Arial, sans-serif;

有趣的是，因为 Windows 手机有可用的 Segoe UI 的本地副本。我想知道为什么 MS 的网络人员不把第二个放在堆栈中......

于 2013-04-05T21:07:49.380 回答
1

好的，这就是在 IIS7.5 上对我有用的方法。我不得不将 MIME 类型 .otf、.svg 和 .woff 添加到 IIS，因为它们还不存在。要添加新的 MIME 类型转到 IIS，单击MIME types模块，右键单击并选择Add...

    .eot -> application/vnd.ms-fontobject
    .otf -> application/font-sfnt
    .svg -> image/svg+xml
    .ttf -> application/font-sfnt
    .woff -> application/font-woff
于 2014-07-24T02:11:44.310 回答
1

这可能会在 8.1 更新中修复：

“从 Windows Phone 8.1 更新的 Internet Explorer 开始，Windows Phone 上的 Internet Explorer 允许跨域字体加载，而不管访问控制标头如何，以提高与现有站点的兼容性” [1]

于 2015-04-24T04:49:16.997 回答
0

与@flo 的答案类似，我可以确认 Windows Server 2008R2 上的 IIS7.5 中的以下 mime 类型，更正了问题：

    .eot -> application/octet-stream
    .otf -> application/font-sfnt
    .svg -> image/svg+xml
    .ttf -> application/octet-stream
    .woff -> application/font-woff
于 2019-07-04T23:35:09.363 回答