字重属性

最后更新：2026-09-13

font-weight 字重属性

font-weight 用于设置文本的粗细程度，从细到粗支持关键字和 1-1000 的数字值。粗体常用于标题和强调文本。

font-weight: normal | bold | bolder | lighter | <number [1,1000]>;

值	类型	描述
`normal \| bold \| bolder \| lighter`	关键字	预定义字重关键字
`<number [1,1000]>`	类型	数字字重值，如 400、700

编辑下方代码，在 playground 中查看实时效果：

浏览器	Chrome	Edge	Firefox	Safari	Opera
font-weight	✓ v2	✓ v12	✓ v1	✓ v1	✓ v1
所有主流浏览器均支持

提示： 400 等价于 normal，700 等价于 bold，这是最常用的两个值。

注意： 并非所有字体都包含全部字重，缺失的字重会被浏览器就近匹配，效果可能不一致。

Qbolder 和 lighter 是什么？

A它们是相对关键字：bolder 让字重比父元素重一级，lighter 轻一级。例如父元素为 400 时 bolder 取 700；若父元素已是最粗则保持不变。它们适合继承场景下的相对调整，不如数字值精确。

Qfont-weight 的数字值怎么用？

A支持 1~1000 的数值，常规字体只有 100/200/…/900 等整百字重，其中 400 即 normal、700 即 bold。可变字体（variable font）可以取任意中间值，配合 CSS 动画实现粗细过渡。

Q为什么设置了 font-weight: bold 没有效果？

A常见原因：所选字体本身没有粗体字重，浏览器只能就近匹配或合成粗体；或该声明被更靠后的样式覆盖。中文系统字体通常只有 regular 和 bold 两档，800/900 等值会就近取 bold，看不出差异。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。