所有 CSS font-weight 属性的值都有用吗？答案

【问题标题】：Are all CSS font-weight property's values useful?所有 CSS font-weight 属性的值都有用吗？
【发布时间】：2014-10-31 11:13:32
【问题描述】：

font-weight:normal
font-weight:bold
font-weight:bolder
font-weight:lighter
font-weight:100
font-weight:200
font-weight:300
font-weight:400
font-weight:500
font-weight:600
font-weight:700
font-weight:800
font-weight:900

到目前为止，我只使用了font-weight:bold，有时还使用了font-weight:normal 来覆盖粗体。其他的有什么用？

我使用属性的所有值创建了这个示例页面，但其中许多值没有太大区别。

http://jsbin.com/omaha3

【问题讨论】：

值得注意的是，在 Chrome 中font-weight:600 是最大胆的——它甚至比bolder 和font-weight:900 更大胆

标签： css

【解决方案1】：

如果您显示的字体具有更多的权重，例如半粗体、浅色等。如果您使用其中一个数值，浏览器可能能够呈现这些权重。不过，大多数最终用户字体只有两种或三种样式，所以我认为这不太适用于现实世界。我只依赖普通（=400 我认为）和粗体（=700）。

W3C reference on font-weight: bold 中还有很好的附加信息。

更新：这里是in-depth blog post，介绍了现代浏览器中样式的呈现方式。它的标题是“除一个浏览器外，其他所有浏览器的字体粗细仍然损坏”:)
第二次更新：由于 cagnut.com 遭受了灾难性的数据丢失，here 是存档帖子

【讨论】：

所以这些属性的使用取决于字体。
@jitendra 是的，字体的格式是什么，浏览器是否可以将大小单位转换为字体内的正确粗细。可能是某些浏览器试图“增肥”普通字体以达到效果，但结果可能好坏参半。
@jitendra 我添加了一个链接到我的答案。
我添加了我的问题的链接。

【解决方案2】：

这也取决于浏览器/操作系统。 Mac 上的 Firefox 倾向于支持更多的刻度（Myarid pro 有 5 种不同的粗细），Windows 上的 Firefox 3 有时会显示较浅的字体。 Window 或 Mac 上的其他浏览器仅显示两种粗体 - 粗体或正常。

当我想要跨浏览器控制字体粗细时，我将文本颜色设置为灰色 - 比如 #777，然后我的粗体颜色可以是 #444 和 #000，我的浅色可以是 #aaa 和 #ddd .它不会像 font-weight 那样改变粗细，但仍然会产生视觉冲击。

编辑添加了带有字体粗细的 IE6 疯狂

打印样式表中的

font-weight:600 会导致 IE6 打印出粗体和斜体，但打印预览仅显示粗体。

【讨论】：

【解决方案3】：

取决于要求，当您为时尚的文本外观创建比例字体大小时可能很有用。

【讨论】：