Question

我经常看到一些项目，其中字体（不是像谷歌字体这样的CDN）每个重量都会有一个字体文件。总是这样吗？

我问，因为我从客户端发送了一个字体文件（Yuanti SC，一个.ttc，但我将其转换为otf和ttf），我似乎无法获得除粗体以外的任何其他权重。

@font-face {
    font-family: Yuanti;
    src:  url(/fonts/yuanti.otf) format('otf'),
          url(/fonts/yuanti.ttf) format('truetype');
    font-weight: 100;
}

我想确保一个字体文件中有多个字体权重是不可能的（或者至少不太可能）。

Answer 1

每个重量一个字体文件。总是这样吗？

简答：是的。

单个OpenType字体仅涵盖单个权重，但不要将字体权重与CSS权重混淆。字体在技术上可以any weight between 0 and 65336，这些数字在技术上并不代表任何东西，它们只是代工厂表明他们认为适合整个家庭的方式的一种方式（由许多不同加权/建模的单个字体组成）。

在CSS中，存在一个人为限制，即只有100到900的权重，增量为100.权重＆＃34; 150＆＃34;例如，即使字体文件的OS/2 metadata table中的权重值为150（顺便提一下，对于历史记录称为OS / 2），在CSS中也没有任何意义只有原因。）

如果浏览器支持字体集合，您可以使用它们，但它们并不是：您加载多个权重的方式是字面上加载多种字体：

@font-face {
  font-family: "myfont";
  font-weight: 100;
  src: url(fonts/super-bold.woff) format("woff");
}

@font-face {
  font-family: "myfont";
  font-weight: 400;
  src: url(fonts/italic.woff) format("woff");
}

@font-face {
  font-family: "myfont";
  font-weight: 900;
  src: url(fonts/ultra-thing.woff) format("woff");
}

请注意那里发生的事情：字体文件本身的字体权重是什么并不重要：你定义哪个权重映射到哪个实际字体资源，所以如果我们说＆＃34;在我的CSS中，重量100映射到超级粗体＆＃34;然后浏览器会这样做。 CSS @font-face定义定义了资源文件和CSS样式/权重之间的映射，而不是字体文件。

通常情况下，你可以将100与超轻，400到普通，以及900到超黑，但这是你做主，而不是字体。 CSS不尊重OpenType元数据，@font-face绑定得到了最后的发言权。

至于为什么浏览器不支持字体集合，这与加载字体时实际使用的数据有关。＆＃34;真＆＃34; OpenType字体（您在计算机上用于通用排版的字体）带有大量数据，这些数据在作为webfont（例如名称和上下文元数据）加载时完全被忽略，而加载字体集合则需要实际解析大量的数据和基于所发现的资源进行资源映射，不仅使得打包资源映射到什么地方的问题显着复杂化，而且还需要额外的代码来正确处理需要覆盖的非偶数边缘情况。＆＃34;如果有人加载了一个集合但他们想要控制哪个子资源映射到哪个样式/权重值会发生什么？＆＃34;。

因此，添加集合支持会使事情变得非常复杂，没有任何实际好处：将OpenType集合提取到单独的ttf / otf字体（两者都是OpenType字体，它们只在字形定义上有所不同;所有其他数据都是通过使用WOFF或WOFF2简单地将它们打包到网上是微不足道的，并且让设计者/用户可以更好地控制如何加载这些字体，因此我们不太可能很快看到收集支持。

Answer 2

正如nwellnhof所说，TrueTypeCollections可以包含与权重有关的不同字体，但它也可以是浏览器渲染字体的方式，可以给人以额外重量的印象。

如果您有photoshop，可以通过更改值之间的ani-aliasing属性来查看。但是有时候，改变字体加载可以对此产生影响的顺序，但它也会使它变得更糟。谷歌现在通常会对字体进行平滑的演绎。

这并不是一个真正的解决方案，但希望我在漫游上有所帮助。

字体文件（例如.ttc .ttf .otf）包含不同的权重吗？

2 个答案: