页面上的价格数字明明是粗体，切到另一台电脑就变细了。打开开发者工具一看，font-weight 写的是 700，计算值也是 700，渲染出来却没变化。多半是字体文件里根本没有粗体这一档，浏览器只能拿常规字重凑合。

font-weight 的数值怎么对应

CSS 里 font-weight 可以写关键字 normal、bold，也可以写 100 到 900 的整数，步长是 100。normal 等于 400，bold 等于 700。实际渲染时，浏览器会在字体家族里找最接近的字重：字体只有 400 和 700，你写 500，多数浏览器会落到 400；写 600 可能落到 700，具体看浏览器的匹配规则。

中文字体常常只有两档

微软雅黑、宋体这类系统字体，一般只带常规和粗体两档，写 300 不会变细，写 500 也不会变中等。想要更多字重，得引入带多档字重的 Web 字体，或者用可变字体。只引了 Regular 一个文件却在样式里写 bold，浏览器会做合成加粗，笔画发糊、字间距变挤，打印出来更明显。

.price { font-family: Microsoft YaHei, sans-serif; font-weight: 700; } .text-light { font-weight: 300; }

strong 和 b 不是一回事

标签层面的加粗有两个：strong 表示重要内容，浏览器默认样式是 bold；b 只表示视觉加粗，没有语义。屏幕阅读器会强调 strong 里的内容，b 不会。纯为了好看可以用 CSS 控制，别拿 b 堆一屏。要强调语气，用 strong 更合适。

继承和优先级也会捣乱

font-weight 会继承，父元素写了 bold，子元素默认也跟着粗。想恢复常规，要在子元素上显式写 font-weight: 400，而不是指望 normal 自动覆盖。组件库的样式优先级高，自己的类名压不过去，打开开发者工具看划掉的规则，别一味加 !important。

什么时候该换字体文件

设计稿要求 600 字重，而且中英文都要，最稳的办法是让字体文件覆盖 400、600、700 三档，并在 @font-face 里分别声明。只有标题用粗体，也可以给标题单独指定字体家族。数字用等宽字体时，注意等宽字体往往没有粗体，价格、倒计时这类场景要提前试。

css字体加粗 说到底就两件事：样式写对，字体文件里有对应字重。只在样式里改数值、不管字体资源，换台机器就可能翻车。