Question

我已经重新创建了我使用CSS font-family和Chrome for Android的问题。 Web浏览器不会正确继承字体，而是使用后备字体。

这似乎是已经在Google上发票的错误（http://code.google.com/p/chromium/issues/detail?id=138257）。

将<meta name="viewport" content="width=device-width, initial-scale=1" />添加到HTML应该可以解决问题，但这只能解决第一个元素的设置字体问题。

JS Bin链接将有助于解释我在说什么。所以，如果有人使用Chrome for Android，请转到链接查看我在说什么！

感谢。

Answer 1

我解决这个问题的方法是彻底抛弃Google Webfonts，而是将字体下载到Web服务器并通过CSS调用它们，如下所示：

@font-face {
    font-family: 'Droid Sans';
    src: url('fonts/DroidSans-webfont.eot');
    src: url('fonts/DroidSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSans-webfont.woff') format('woff'),
         url('fonts/DroidSans-webfont.ttf') format('truetype'),
         url('../fonts/DroidSans-webfont.svg#DroidSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

谷歌的网站字体是开源的，所以我们应该没有问题找到字体的下载。

此解决方案适用于Dolphin和Chrome for Android。

Answer 2

我今天也注意到了这一点。不仅在我的Nexus 7（Android 4.2.2）上，而且在朋友的MacBook Pro上的Chrome for MacOS X中。这并不是一个问题，因为我通常选择通过fontsquirrel.com转换我需要的字体，但是对于直接从Google集成字体进行测试和原型设计会更加方便。

Chrome for Android无法正确显示Google网络字体

2 个答案: