我们为什么要在字体中包含ttf，eot，woff，svg ...

299

在CSS3 font-face，有包括如多发性字体类型ttf，eot，woff，svg和cff。

我们为什么要使用所有这些类型？

如果它们专用于不同的浏览器，为什么它们的数量大于主要Web浏览器的数量？

css font-face webfonts

— 用户名
source

Answers:

425

在2019年回答：

仅使用WOFF2，或者如果需要传统支持，请使用WOFF。不要使用任何其他格式

（svg和eot是无效格式，ttf并且otf是完整的系统字体，不应将其用于网络用途）

2012年的原始答案：

简而言之，font-face很老，但直到最近才得到IE的支持。

eot 早于IE9的Internet Explorer是必需的-他们发明了规范，但eot是专有解决方案。
ttf并且otf是正常的旧字体，因此有些人感到恼火，这意味着任何人都可以免费下载昂贵的许可字体。
随着时间的流逝，SVG 1.1增加了“字体”一章，该章解释了如何仅使用SVG标记为字体建模，人们开始使用它。花费了更多时间，事实证明，与仅使用常规字体格式相比，它们绝对可怕，并且SVG 2明智地再次删除了整个章节。
然后，woff由具有相当丰富的领域知识的人发明，这使得可以以丢弃对系统安装至关重要但对网络无关的位（使人们担心盗版感到高兴）的方式托管字体，并且允许进行内部压缩以更好地适应Web的需求（使用户和主机满意）。这成为首选格式。
2019 edit几年后，woff2被起草并被接受，这改善了压缩效果，从而导致文件更小，并且能够“部分地”加载单个字体，从而可以将支持20个脚本的字体存储为“块”而是在磁盘上显示，而浏览器可以根据需要自动加载字体“部分”，而无需预先传输整个字体，从而进一步改善了排版体验。

如果您不希望支持IE 8或更低版本，iOS 4或更低版本以及android 4.3或更早版本，则可以使用WOFF（对于支持该功能的最新浏览器，可以使用WOFF2（压缩程度更高的WOFF）。）

@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

— 里奇·布拉德肖
source

iOS 5确实支持WOFF。

— 罗布（Rob）

woff...具有阻止他人盗用字体的模式？这到底/如何运作？

— 马克·阿默里

TTF不应轻于WOFF。WOFF是TrueType-OpenType字体（ttf和otf）的压缩形式。

— toto_tico 2014年

WOFF的重点不是反盗版。TypeKit说：“与TrueType字体相比，OpenType / CFF字体的两个主要优点是1）文件尺寸更小，以及2）它们需要的提示信息少得多，以便在允许某种形式的抗锯齿的环境中很好地呈现。 ”

— Michael McGinnis 2014年

@Zelphir工具很难用该标志创建可嵌入的字体，而且您的常规设计师是编程不熟练的人，只有在有人设计了带有闪亮的“海盗字体”按钮的Mac应用时，才能删除该标志。此外，如果他们是公司，则可以提起法律诉讼。如果他们是某个拥有博客的人，请与他们交谈，否则，他们的主持人等等-但请记住，那些无法购买您字体的人无论如何都不是潜在的顾客，所以我想说免费宣传值得更多而不是说服他们将其换成dafont上最接近的东西的麻烦。

— 卡米洛·马丁

Woff是TrueType-OpenType字体的压缩（压缩）形式。它很小，可以像图形文件一样通过网络传递。最重要的是，通过这种方式可以完全保留字体，包括很少有人关注的渲染规则表，因为他们仅使用拉丁脚本。

看一下[删除无效网址]。您看到的字体是实验性网络提供的smartfont（woff），它具有成千上万个组合的字符，可以形成复杂的形状。基础文本是罗马字母Singhala的简单拉丁代码。（复制并粘贴到记事本中查看）。

只有woff可以执行此操作，因为没有人拥有此字体，但是在任何地方（Mac，Win，Linux甚至是除IE之外，所有浏览器都可以在智能手机上看到它），但IE除外。IE不完全支持Open Types。

— 用户名
source

我在那个网站上看不到什么特别的东西。如果将其复制到编辑器（具有utf8支持）中，我仍然只能看到普通文本。woff到底是做什么的？

— Zelphir Kaltstahl，2015年

这个答案的三分之二要么是错误的，要么是无关紧要的。那个链接也坏了。

— Yay295 '16

Chrome，Opera和Firefox支持基于Brotli压缩算法的WOFF 2.0和对WOFF 1.0的其他改进，使文件大小减少了30％以上。

http://en.wikipedia.org/wiki/Web_Open_Font_Format http://en.wikipedia.org/wiki/Brotli

http://sth.name/2014/09/03/Speed-up-webfonts/上有一个使用示例。

基本上，您将一个src url添加到woff2文件中并指定woff2格式。在woff格式之前使用此格式很重要：浏览器将使用它支持的第一种格式。

— 耶尔基·阿拉库贾拉（Jyrki Alakuijala）
source