12

当我使用 Google Webfonts 时,它们在我关心的每个浏览器上都能正常加载,除了 Chrome/iOS。这看起来很奇怪,因为它在 Mac 版 Chrome 和 iOS 版 Safari 上运行良好,所以我认为这不是 iOS 问题或 Google Chrome 问题。它似乎特定于 Chrome/iOS。

任何关于如何解决此问题的想法或想法都会很棒!

谢谢!

编辑

我正在使用托管在 Google 上的 Google Web Fonts,其中包含以下内容:

<link href="http://fonts.googleapis.com/css?family=Leckerli+One" rel="stylesheet" type="text/css" />

在我的字体(SASS)中,我使用以下内容:

h1
  font-family: "Leckerli One", cursive
4

7 回答 7

9

我看到了同样的问题。在我自己的服务器上托管字体文件并重写 @font-face 规则以匹配解决了我的问题,无论是在我的本地开发服务器还是在产品中。

我不知道原因;我最好的猜测是在 UIWebViews 中执行不同的同源问题(由于 App Store 规则,iOS Chrome 是 UIWebView)。

于 2012-12-18T14:39:58.423 回答
4

IOS 设备仅使用 TTF 格式(或 OTF,如果它们遵循以下开发者指南)。该字体被用作 WOFF、EOT 和 OTF(可能不遵循指南)。有些服务会为您提供其他版本。尝试使用@font-face 指定字体,看看是否能解决问题!Fontsquirrel 有一个@font-face 生成器来完成繁重的工作。

关于后续问题。Apple 提供了一些关于 TrueType 字体实现的开发人员文档。可以在这里找到。本质上,TTF 格式将字体存储为 sfnt 资源。唯一可以做到这一点的其他字体格式是 OpenType 的偏移表 sfnt 包装器。因为 IOS 使用 sfnt 包装器读取字体,所以您会遇到不以这种方式存储的字体的问题。(对不起所有的行话)。

于 2012-12-19T17:38:20.303 回答
4

You can use the Google Fonts API Loader which will detect the user's browser and send back appropriately formatted CSS.

Sample code is available in the first response on this Stack Overflow question.

This will allow both Safari and Chrome (and other UIWebView-based browsers) to display the font correctly.

Note: if you want to store the fonts locally, as @Dave suggested, this CSS should work.

于 2012-12-21T02:12:52.147 回答
2

CSS中你可以使用

!important

例子:

@font-face {
  font-family: 'Monda' !important;
  font-style: normal !important;
  font-weight: 400 !important;
  src: local('Monda Regular'), local('Monda-Regular'), url(http://themes.googleusercontent.com/static/fonts/monda/v1/sk05J8GA1NvUxDnk43EgAQ.woff) format('woff') !important;
}
于 2012-12-09T22:46:36.043 回答
0

对我来说,在 php 页面中添加作品:

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Trocchi');
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
</style>
于 2017-05-13T21:27:32.067 回答
0

如果其他人仍然看到此问题 - iOS 9 或更早版本的 Chrome 中未加载字体 - 请仔细检查字体是否作为 css 文件而不是 js 文件导入。Fonts.com 将为您提供将字体导入为 js 的选项,这不会在 Chrome / iOS 9 或更低版本上获取。将我的导入更改为 css 为我解决了这个问题。

于 2016-12-01T19:51:38.160 回答
0

我最近在 UIWebView 上遇到了类似的问题。我对 iOS 应用程序和 Web 源进行了额外的更改,但没有任何帮助。

最后通过简单地将 Google Font 的链接更改为https来修复它。

于 2018-05-12T17:04:11.523 回答