我目前有一个带有 WebView 的应用程序。 Web View 加载确定每个设备应使用的特定字体的 css。
对于我的 iOS 设备,我使用 HelveticaNeue CondensedBold,因为它包含在 iOS5+ 中。由于我不能将其用于早期的 iOS 和 Android,因为它不是系统字体,所以我使用的是 Google 的 OpenSans-CondensedBold。
我遇到的问题是在使用 2.3.X 的 Android 设备上。 font-family 回退根本不起作用。由于 HelvelticaNeue 字体不存在,它只是失败并且不会回退到下一行的 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;
}
最佳答案
您可以尝试将字体文件编码为 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');
}
如果您使用的是指南针,它显然有 a method即时编码字体文件
有a related也对这个方法有疑问
关于Android 2.3.X css 字体系列回退不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14466370/