1

我目前有一个带有 webview 的应用程序。webview 加载确定每个设备应使用的特定字体的 css。

对于我的 iOS 设备,我使用 HelveticaNeue CondensedBold,因为它包含在 iOS5+ 中。由于我不能将它用于早期的 iO​​S 和 Android,因为它不是系统字体,我使用的是 Google 的 OpenSans-CondensedBold。

我遇到的问题是在使用 2.3.X 的 Android 设备上。字体系列后备根本不起作用。由于 HelveticaNeue 字体不存在,它只会失败并且不会回退到紧随其后的 OpenSans。

font-family: 'OpenSans-CondensedBold', 'Helvetica', 'Arial';

如果我在上面的示例中从 css 中删除 HelveticaNeue-CondensedBold,OpanSans 字体可以在 Android 上完美运行。

当前的 CSS 下面。

@font-face {
    font-family: 'OpenSans-CondensedBold';
    src: url('/webfonts/opensans-condbold.eot');
    src: url('/webfonts/opensans-condbold.eot?#iefix') format('embedded-opentype'),
         url('/webfonts/opensans-condbold.woff') format('woff'),
         url('/webfonts/opensans-condbold.ttf') format('truetype'),
         url('/webfonts/opensans-condbold.svg#OpenSans-CondensedBold') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
    font-size: 13px;
    font-family: 'HelveticaNeue-CondensedBold', 'OpenSans-CondensedBold', 'Helvetica', 'Arial';
    font-weight: normal;
    font-style: normal;
}
4

1 回答 1

0

您可以尝试将字体文件编码为 base64 数据 uri .. sencha touch 2 也在执行此操作,并且似乎可以正常工作。

为此,请在此处上传您的字体文件http://dopiaza.org/tools/datauri/index.php 然后像这样在您的 CSS 中使用生成的代码

@font-face {
    font-family: "My Font";
    src: url(data:application/x-font-woff;base64,[base-encoded font here]) format('woff'), 
         url(data:image/svg+xml;base64,[base-encoded font here]) format('svg'), 
         url(data:application/x-font-ttf;base64,[base-encoded font here]) format('truetype'); 
}

如果您使用的是指南针,它似乎有一种即时编码字体文件的方法

这个方法也有一个相关的问题

于 2013-06-05T11:56:39.333 回答