1

与需要为每个粗细（300、400、500 等）创建一个文件的传统字体不同，可变字体允许您通过单个（较小的）字体文件访问字体粗细和样式的每个组合。这对网络有明显的好处，我正在尝试使用 Google Fonts 中的Inter字体，Google 和设计师的网站都声称它是可变字体。

但是，当在 Google Fonts 中选择字体时，我仍然需要选择我想要使用的单个权重，并且生成的<link>标签还指定了单个权重，这表明它正在下载这些文件中的每一个：

<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600&display=swap" rel="stylesheet">

我还注意到它似乎没有斜体，当我尝试渲染斜体时，它会用假斜体模拟它们，我通过添加 CSS 规则来确认font-synthesis:none：

font-style: italic;
font-synthesis: none ; /* Disables faux italics and other simulated styles: 
                          if no italic style is installed, defaults to normal

为什么会这样，我如何通过谷歌字体使用可变版本的Inter，包括斜体？

4

2 回答 2

1

谷歌字体允许您在可变轴部分选择一个非标准值，但您仍然需要输入值/秒，因为谷歌提供较小和特定的文件以避免大请求，它也近似它们。

例如，通过选择401，410您将获得与响应完全相同的文件（唯一的区别是font-weight样式）。

检查它们：

顺便说一句，国际米兰似乎没有斜体字。

于 2021-12-24T17:18:57.683 回答
0

谷歌字体确实允许您在您的网站中加载可变字体，而不是特定的权重。有关详细信息，请参阅：

https://fonts.google.com/knowledge/using_type/loading_variable_fonts_on_the_web

于 2021-12-27T17:15:51.613 回答