16

我正在使用@font-face在网站上显示 League Gothic,但它没有显示在 Android 1.6 上。这是我的代码,由Font Squirrel 的 @font-face 生成器生成

@font-face {
    font-family: 'LeagueGothicRegular';
    src: url('/fonts/League_Gothic-webfont.eot');
    src: local('☺'), url('/fonts/League_Gothic-webfont.woff') format('woff'), url('/fonts/League_Gothic-webfont.ttf') format('truetype'), url('/fonts/League_Gothic-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;
}

font-family:'LeagueGothicRegular',Impact,Charcoal,sans-serif;

如果不支持,这没什么大不了@font-face的(我读到@font-face支持在 Android 2 中完全消失了)。但是 League Gothic 非常简洁,所以我想为 Android 指定一种比默认的 sans-serif 更好的后备字体,这样设计就不会完全破坏。

这样的东西会很完美: http ://www.droidfonts.com/info/droid-sans-condensed-fonts/

但我找不到 Android 附带的默认字体的明确列表,以及我应该在 CSS 中引用它们的名称。

编辑 到目前为止的答案没有抓住重点(或者我的问题措辞很糟糕) - 我所追求的是Android附带的系统字体列表。像这样的Android。

4

3 回答 3

44

我在尝试让 webfonts 在 imeveryone 上工作时遇到了完全相同的问题。截至目前,互联网上似乎没有任何地方直接说明这一点,所以我会在这里做:

用于阻止 IE 阻塞 IE 不支持的文件格式的“local()”语法也会阻止 Android 加载 Android 支持的字体

哦亲爱的。但它很容易修复。重要的是忽略 'Bulletproof Font Face' 本地 IE 解决方法。这是一个巧妙的 hack,不应该破坏 Android,但它确实,责怪谷歌。

Android 确实支持 TTF 和 OTF文件。快乐地支持 Android 和 IE(以及所有其他浏览器)的正确语法如下

O 1)在任何常规样式表之前,您需要两个单独的字体样式表:

<link rel="stylesheet" type="text/css" href="/css/fonts.css" />
<!--[if IE]>
    <link rel="stylesheet" href="/css/styleiefonts.css}" type="text/css" charset="utf-8" />
<![endif]-->

O 2) 在 Android 和大多数其他浏览器使用的普通样式表中,不要使用本地 hack:

@font-face {
    font-family: 'LeagueGothicRegular';
    src: url('/static/fonts/League_Gothic-webfont.woff') format('woff'),
        url('/static/fonts/League_Gothic-webfont.ttf') format('truetype'),
        url('/static/fonts/League_Gothic-webfont.svg#webfontOTINA1xY') format('svg');
    font-weight: normal;
    font-style: normal;
}

O 3. 在 IE 特定样式表中,照常继续:

@font-face {
    font-family: 'LeagueGothicRegular';
    src: url('/static/fonts/League_Gothic-webfont.eot');
}

这就是在所有浏览器中获得工作网络字体所需的全部内容。目前。总有一天,谷歌会修复安卓,微软会修复 IE,所以这个答案将不再适用。

于 2010-12-23T16:11:54.563 回答
12

我看到安装在我的 Android (2.2) 系统文件中的字体是:

  • Clockopia.ttf
  • DroidSans-Bold.ttf
  • DroidSans.ttf
  • DroidSansArabic.ttf
  • DroidSansFallback.ttf
  • DroidSansHebrew.ttf
  • DroidSansMono.ttf
  • DroidSansThai.ttf
  • DroidSerif-Bold.ttf
  • DroidSerif-BoldItalic.ttf
  • DroidSerif-Italic.ttf
  • DroidSerif-Regular.ttf
于 2011-05-16T00:54:17.763 回答
11

我听说过,但还没有测试过,Richard Fink 开发的“Mo' Bulletproofer”方法可以解决所有这些问题(IE 和 Android),而不需要双重样式表。语法是:

@font-face{ /* for IE */
font-family:'LeagueGothicRegular';
src:url(fishy.eot);
}
@font-face { /* for non-IE */
font-family: 'LeagueGothicRegular';
src:url(http://:/) format("No-IE-404"),url('/fonts/League_Gothic-webfont.woff') format('woff'), url('/fonts/League_Gothic-webfont.ttf') format('truetype'), url('/fonts/League_Gothic-webfont.svg#webfont') format('svg');
}

希望这可以帮助!

于 2011-01-07T13:14:44.530 回答