46

我看过一些网站,其中提到了 CSS -font-weight: 700font-weight: bold. 但是两个结果是一样的。哪一个是正确的,我们应该如何遵循?请给我建议。

4

5 回答 5

97

font-weight您可以在CSS Fonts Module Level 3 Specification中找到所有有效值的完整细分。在第 3.2 节(字体权重属性)下,我们找到以下列表:

  • 100 - 薄
  • 200 - 超轻(超轻)
  • 300 - 光
  • 400 - 正常
  • 500 - 中等
  • 600 - 半粗体(半粗体)
  • 700 - 粗体
  • 800 - 超粗体(超粗体)
  • 900 - 黑色(重)

您可能注意到这700是“粗体”。所以无论哪种方式,你都会得到相同的结果。(唯一对应于数字的另一个是“正常” - 400。)

完整列表是:

normal- 与“400”相同<br> bold- 与“700”相同<br> bolder- 指定比继承值更粗的粗细
lighter- 指定比继承值更轻的粗细

没有真正的区别。更多的是关于你和你的团队习惯的东西。

于 2012-06-06T06:35:45.320 回答
19

font-weight数字比默认粗体更好,因为在数字中您可以根据设计要求 调整粗体。

检查这个http://www.w3.org/wiki/CSS/Properties/font-weight

于 2012-06-06T06:41:40.027 回答
18

我的基本答案与已经给出两次的答案相同,但参考正确:

根据 CSS 2.1 规范第 15.6 条,它们在定义上是同义词。这是权威规范。

关键字“normal”与“400”同义,“bold”与“700”同义。

单词bold使代码比数字更具可读性700,没有直观意义。在您使用数字指定字体粗细的情况下,该数字可能更适合可读性,以获取没有关键字的粗细。400这种情况很少见,部分原因700是大多数字体不支持其他字体粗细。

于 2012-06-06T07:06:16.373 回答
1

在功能上它们是相等的,但在风格上我会说选择其中一种方法并与之保持一致:要么只使用关键字,要么只使用数字标识符。这使得 CSS 代码更容易理解。

由于字体的权重范围远不止regularbold,例如extra lightlightbookmediumsemiboldblackextra black,因此在使用自定义字体时,通常不可能不使用数字标识符。在这些情况下,我认为最好避免使用regularand ,而是bold使用400and 700。这更加一致并且简化了对 CSS 的理解——即使是没有经验的开发人员也可以很容易地掌握哪个400更薄500,但是当他需要比较regular和时,他可能不知道哪个更薄500

在您使用的唯一权重是regularand的情况下,bold使用关键字而不是数字标识符是完全合理且更具可读性的。但在我的工作中,这种情况几乎不会发生。

于 2018-02-15T12:50:20.463 回答
0

在 Windows 上的某些浏览器(IE、FF)中,doingfont-weight:800不适用于各种 UTF-8 字体。使用font-weight: boldfont-weight: bolder..

我在为 BBC Kyrgyz 制作东西时发现了这一点。

于 2016-08-02T16:38:14.230 回答