font-weight:700 或 font-weight:bold 在 CSS 中我们应该遵循哪一个?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10909234/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-30 04:06:34  来源:igfitidea点击:

font-weight:700 or font-weight:bold which one we should follow in CSS?

csstext-rendering

提问by Pavan Kumar

I have seen some websites, which mentioned in CSS - font-weight: 700or font-weight: bold. But both results are the same. Which one is the correct and how should we follow? Please suggest me.

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

采纳答案by sandeep

font-weightin numbers is better then then default boldbecause in numbers you can adjust the boldas per your design requirements.

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

Check this http://www.w3.org/wiki/CSS/Properties/font-weight

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

回答by Sampson

You can find a full breakdown of all valid values for font-weightin the CSS Fonts Module Level 3 Specification. Under section 3.2(font-weight property) we find the following list:

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

  • 100 - Thin
  • 200 - Extra Light (Ultra Light)
  • 300 - Light
  • 400 - Normal
  • 500 - Medium
  • 600 - Semi Bold (Demi Bold)
  • 700 - Bold
  • 800 - Extra Bold (Ultra Bold)
  • 900 - Black (Heavy)
  • 100 - 薄
  • 200 - 超轻(超轻)
  • 300 - 光
  • 400 - 正常
  • 500 - 中
  • 600 - 半粗体(半粗体)
  • 700 - 粗体
  • 800 - 超粗(超粗)
  • 900-黑色(重)

You likely noticed that 700is "bold". So either way, you'll get the same results. (The only other one which corresponds to a number is "normal" - 400.)

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

The complete list is:

完整列表是:

normal- Same as ‘400'
bold- Same as ‘700'
bolder- Specifies a bolder weight than the inherited value
lighter- Specifies a lighter weight than the inherited value

normal- 与“400”
bold相同 - 与“700”相同
bolder- 指定比继承值更粗的权重 - 指定比继承值
lighter更轻的权重

There's no real difference. It's more about what you and your team are used to.

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

回答by Jukka K. Korpela

My basic answer is the same as already given twice, but with the correct reference:

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

They are synonymous by definition, according to CSS 2.1 specification, clause 15.6. This is the authoritative specification.

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

The keyword 'normal' is synonymous with '400', and 'bold' is synonymous with '700'.

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

The word boldmakes code more readable than the number 700, which has no intuitive significance. The number might be more suitable for readability in situations where you specify font weights using numbers, to get weights for which there are no keywords. Such situations are rare, partly because font weights other than 400and 700are not supported for most fonts.

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

回答by Robert Kusznier

Functionally they are equal, but style-wise I'd say choose one of the methods and be consistent with it: either you use only keywords or only numerical identifiers. That makes the CSS code easier to understand.

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

As fonts have much broader spectrum of weights than only regularand bold, e.g. extra light, light, book, medium, semibold, black, extra black, when using custom fonts it's usually impossible to not use numerical identifiers. In these situations I think it's better to avoid using regularand boldat all, using 400and 700instead. That is more consistent and simplifies understanding of CSS - even an unexperienced developer can easily grasp that 400is thinner than 500, but he may not know which one is thinner when he needs to compare regularand 500.

由于字体具有的权重比只有更广泛的范围regularbold,例如额外的光书籍媒体semibold额外的黑色使用自定义字体时,它通常不可能不使用数字标识符。在这些情况下,我认为最好避免使用regularand bold,而使用400and700代替。这样更一致,也简化了对 CSS 的理解——即使是没有经验的开发人员也能轻松掌握哪个400500哪个更薄,但当他需要比较regular和时,他可能不知道哪个更薄500

In situations, where the only weights you use are regularand bold, it's perfectly reasonable and more readable to use keywords instead of numerical identifiers. But at my work such situations almost don't happen at all.

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

回答by scottj

In certain browsers on Windows (IE, FF), doing font-weight:800will not work with various UTF-8 fonts.. Use font-weight: boldor font-weight: bolder..

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

I found this out the hard way while producing a thing for BBC Kyrgyz ..

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