为什么我们应该在字体中包含ttf，eot，woff，svg，... [英] Why should we include ttf, eot, woff, svg,... in a font-face

问题描述

在CSS3字体中，有多种字体类型，包括truetype，eot，woff，svg和cff。为什么要使用所有这些类型？如果他们是不同的浏览器的特殊，为什么它们的数量大于主要的网络浏览器的数量？

In CSS3 font-faces there are multiple font types included like truetype, eot, woff, svg and cff. Why should we use all of these types? If they are special to different browsers why is the number of them greater than the number of the major web browsers?

推荐答案

，font-face很老，但只是最近才被IE以上的支持。

In short, font-face is very old, but only recently has been supported by more than IE.

• eot is needed for Internet Explorers that are older than IE9 - they invented the spec, but eot is a horrible format that strips out much of the font features.

ttf 和 otf 是正常的旧字体，但有些人很恼火，

ttf and otf are normal old fonts, but some people got annoyed that this meant anyone could download and use them.

大约在同一时间，iPhone和iPad上的iOS实现了 svg 字体。

At about the same time, iOS on the iPhone and iPad implemented svg fonts.

然后，发明了 woff ，它具有阻止人们盗取字体的模式。这是首选格式。

Then, woff was invented which has a mode that stops people pirating the font. This is the preferred format.

如果您不想支持IE 8和更低版本， lower和Android 4.3或更早版本，那么你可以使用WOFF（和WOFF2，一个更高度压缩的WOFF，支持它的最新浏览器）。

If you don't want to support IE 8 and lower, and iOS 4 and lower, and android 4.3 or earlier, then you can just use WOFF (and WOFF2, a more highly compressed WOFF, for the newest browsers that support it.)

@font-face {
  font-family: 'MyWebFont';
  src:  url('myfont.woff2') format('woff2'),
        url('myfont.woff') format('woff');
}

支持 woff 可以在 http://caniuse.com/woff 上检查

支持 woff2 ，请访问 http://caniuse.com/woff2 查看

Support for woff can be checked at http://caniuse.com/woff
Support for woff2 can be checked at http://caniuse.com/woff2

这篇关于为什么我们应该在字体中包含ttf，eot，woff，svg，...的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！