1

我希望在响应式网站上使用购买的带有 WOFF 和 EOT 字体格式的 Web 字体。毋庸置疑,该格式需要适用于包括 Android 在内的所有设备。

我正在与开发人员合作,他们告诉我此类设备不支持 WOFF 和 EOT。

我的问题是,如果可以通过 typekit 托管,这有什么不同吗?

4

2 回答 2

3

您说默认的 Android 浏览器不支持 WOFF 或 EOT 字体是正确的。Android 设备广泛支持的唯一字体格式是 TTF/OTF。一些较新(3.0+)的 Android 版本也将支持 SVG 字体。通常,Web 字体将与所有三种主要格式打包在一起:WOFF、EOT 和 TTF/OTF。这三种文件类型在您的 CSS 中与正确的 @font-face 一起使用时,将确保该字体在当今大量使用的几乎所有设备/浏览器上都能正常工作。

您的 webfont 应该具有所有三种主要文件格式。如果没有,您可以使用Font Squirrel Webfont Generator之类的工具来获取它。通过 typekit 托管也可以提供解决方案,但 typekit 在某些情况下并不是免费的,这与自己进行转换不同。

于 2013-10-12T03:11:51.730 回答
-3

试试这个实现

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

h1 {
  font-family: 'OpenSans';
  font-weight: 300%;
}

有关更多信息,请查看此示例https://github.com/ttibensky/BulletProof-font-face-implementation

于 2014-01-27T10:03:40.193 回答