我读过类似的帖子,但这个问题有点不同:我有:
<head>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic' rel='stylesheet' type='text/css'>
//rest of the code...
在CSS样式文件中我有:
body{
font-family: 'Source Sans Pro', sans-serif;
//rest of the code...
它在浏览器中运行得很好,但是当我用手机输入时,单词就消失了,页面永远只有结构。我仍在开发网页,因此我尝试使用移动设备来检查一切是否正常。
1.- 我已经尝试过
@import url(http://fonts.googleapis.com/....
但什么也没有。
2.- 我已将 css 文件中的字体更改为 Arial 并且可以正常工作。
3.- 我的手机是带有 chrome 的 Nexus 4。
4.- 我尝试过使用 Google Api 的另一种字体,但没有任何效果。
5.- 它在桌面浏览器中完美运行。即使在 IE 中也是如此。
有人知道可能是什么问题吗?谢谢!
@ajck,似乎是 Chrome 在移动设备上的限制。导入谷歌字体的经典方法不适用于移动设备上的网络字体加载器。仅当您直接在 CSS 中导入字体时,它才会起作用。我还没有在 IOS 上尝试过,但我相信它是一样的。这是 github issues 上提供的示例:
<style type="text/css">
@font-face {
font-family: 'Courgette';
font-style: normal;
font-weight: 400;
src: local('Courgette Regular'), local('Courgette-Regular'), url(https://fonts.gstatic.com/s/courgette/v4/BHG8ZtTfO0yYnp02--QxqltXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
</style>
应用这些更改后,我的字体似乎可以在我的 Android 手机上正确加载。希望这也能解决您的问题!