如何显示与字体粗细相关的正确'style'?

How to display the correct 'style' related to the weight of a font?

我什至不知道称它为样式是否正确,因为它的值是斜体。无论如何,我在我的网站上使用的是 Proxima Nova,但该字体有一点奇怪。

如果我使用这个:

font-family: "Proxima Nova light";

显示图片1


如果我这样做:

font-family: "Proxima Nova", light;

或:

font-family: "Proxima Nova";
font-weight: 100;

我得到图像 2




为什么会这样?粗细不应该跟字体有关吗'style'?

如果不使用方法 1,如何正确处理?

以下尝试加载 font-family "Proxima Nova light":

font-family: "Proxima Nova light";

这会尝试加载 "Proxima Nova",如果找不到,则会调用 "light":

的 font-family
font-family: "Proxima Nova", light;

不出所料,这会尝试加载 "Proxima Nova",并将 font-weight 设置为亮灯:

font-family: "Proxima Nova";
font-weight: 100;

许多字体创建者为浅色、粗体、斜体等创建了不同的系列,而不是依赖浏览器来改变字体本身。这是为了避免 运行 字符通过浏览器的通用算法(如 font-weight: 100font-style: italic 等)导致的混叠和其他视觉失真。