android - Android 版 Chrome 无法正确显示 Google 网络字体

Question

我已经重现了我在使用 CSS 时遇到的问题 font-family和安卓版 Chrome。 Web 浏览器没有正确继承字体，而是使用后备字体。

http://jsbin.com/iyifah/1/edit

这似乎是一个已在 Google 上发布的错误 (http://code.google.com/p/chromium/issues/detail?id=138257)。

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

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

谢谢。

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;
}

Google 的网络字体是开源的，因此我们可以毫无问题地找到这些字体的下载地址。

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