CSS 字体粗细数字：它们是如何工作的？答案

【问题标题】：CSS font-weight numbers: how do they work?CSS 字体粗细数字：它们是如何工作的？
【发布时间】：2016-05-30 00:43:06
【问题描述】：

我正在尝试使用 font-weight 来调整字体的粗体程度。据我了解，值 500 是正常字体粗细，值 700 是粗体的默认字体粗细。

但是，当我输入 599 时，它根本没有改变字体粗细。但是当我输入 600 时，它会跳转到默认的粗体字重。值 600-900 的结果相同。然后，当您超过 900 时，字体粗细会恢复为正常字体粗细。为什么会这样？

#fontStyle {
    border: 1px solid black;
    font-weight: 599;
}

&lt;div id="fontStyle"&gt; fontStyle &lt;/div&gt;

【问题讨论】：

【解决方案1】：

默认字体粗细为 400，字体以 100 的倍数工作。300 为浅色（如果您的字体支持），400 为常规字体，600 为半粗体，700 为粗体。您不能使用中间的数字。

【讨论】：

【解决方案2】：

字体粗细从 100 到 900，以 100 为增量。正常粗细为 400。粗体为 700。

599 不是一个公认的重量，因为它不是 100 的增量。任何超过 900 的东西也不会被识别。

所以你应该使用 font-weight: 600 半粗体或 font-weight:700 粗体。

【讨论】：

【解决方案3】：

你用过 599，你只能用数字 100、200、300 等等。所以font-weight: 600 可以工作

【讨论】：

【解决方案4】：

in the spec 涵盖了数值如何映射到字体粗细的详细信息，其中指出：

值 '100' 到 '900' 形成一个有序序列，其中每个数字表示至少与其前身一样暗的权重。这关键字“正常”是“400”的同义词，“粗体”是同义词与“700”。 'normal' 和 'bold' 以外的关键字已显示经常与字体名称混淆，因此数字比例为 9 值列表选择。

'599' 不是 font-weight 属性的有效值

【讨论】：