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

时间:2010-03-13 11:51:26

标签: css

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

3 个答案:

答案 0 :(得分:13)

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

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

更新:这是关于如何在现代浏览器中呈现样式的in-depth blog post。标题为“除一个浏览器外,字体重量仍然被打破”:) 第二次更新:由于clagnut.com遇到了灾难性的数据库here,因此已归档

答案 1 :(得分:5)

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

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


编辑以使用font-weight

添加IE6疯狂 打印样式表中的

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

答案 2 :(得分:-1)

取决于要求,在为时尚的文字外观创建比例字体大小时非常有用。