CSS字体重量-看不见的差异？

Question

我做了这个简单的演示 。

我可以在Visual Studio中看到font-weight可以具有的所有值：

但是，当我尝试所有这些值时，我只能找到4个不同的值。

我添加了那些红色矩形，以便您可以看到谁具有相同的宽度。

为什么中间的所有（和最后一个）看起来都一样？ 为什么我需要所有这些数字？

Answer 1

不同的字体可以使用不同的字体粗细。 您的浏览器没有在尝试模拟丢失的粗细（这是一件好事，很难做到正确），因此您只能使用所安装字体的已安装版本中存在的粗细。

Answer 2

这可能是因为字体不支持太多不同的粗细，或者浏览器无法显示这些粗细。

无论如何，数字都必须存在，因为这是字体粗细的工作方式。 如果字体确实支持不同权重，然后它是由浏览器尽可能准确，因为它可以显示它; 否则，它将尝试适当地回退到支持的最接近距离。