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

Question

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

Answer 1

如果您显示的字体具有更多权重,如半粗体,浅色等,则如果您使用其中一个数值,浏览器可能会渲染这些权重.大多数最终用户字体只有两种或三种样式,所以我认为这不适用于现实世界.我会依赖普通(= 400我认为)和粗体(= 700).

关于font-weight的W3C参考还有很好的附加信息:粗体.

更新:这是一篇关于如何在现代浏览器中呈现样式的深入博客文章.它标题为"字体重量仍然在一个浏览器中被破坏":)
第二次更新:因为clagnut.com遭遇灾难性数据,这里是存档的帖子

Answer 2

这也取决于浏览器/操作系统.Mac上的Firefox往往支持更多的毕业(Myarid pro为5个不同的权重),Windows上的Firefox 3有时会显示浅色字体.Windoows或Mac上的其他浏览器仅显示两个权重 - 粗体或正常.

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

编辑以使用font-weight添加IE6疯狂

打印样式表中的font-weight:600导致IE6以粗体和斜体打印,但打印预览仅显示粗体.