font-weight未生效的主因是字体不支持对应字重，需通过DevTools检查计算值及字体文件是否存在；其次注意加载顺序、简写语法缺失font-family、打印/移动端兼容性等问题。
font-weight 设置了但没变粗？先看字体支不支持
绝大多数情况下，font-weight: 500 或 font-weight: 600 不生效，不是你写错了，而是当前字体压根没提供这个字重。比如系统自带的 Microsoft YaHei（微软雅黑）只包含 normal（400）和 bold（700）两个字重——中间的 500、600 全部被浏览器自动“降级”到 400 或“升级”到 700。
- 用开发者工具（DevTools）打开「Computed」面板，看
font-weight最终计算值是 400 还是 700，再点开旁边的字体名，确认它是否真有对应字重文件 - Google Fonts 等服务默认只加载
wght@400和wght@700，要支持 500，得显式加参数，例如：https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700 - 自定义字体必须用
@font-face分别声明每种字重，且font-weight值要严格匹配：
@font-face {
font-family: 'MyFont';
src: url('myfont-medium.woff2') format('woff2');
font-weight: 500; /* 必须写 500，不能写 medium */
}
@font-face {
font-family: 'MyFont';
src: url('myfont-bold.woff2') format('woff2');
font-weight: 700;
}线上正常、本地失效？优先级和加载顺序在捣鬼
常见于用了第三方 UI 库（如 Element Plus、Ant Design）的项目：本地开发时你的 CSS 在框架样式之后引入，所以能覆盖；但构建后打包顺序变了，框架样式反而盖住了你的 font-weight。
- 检查 DevTools 的「Styles」面板，看你的规则是不是被划掉（strikethrough），被哪个选择器干掉了
- 不要依赖
!important治标，优先改选择器权重，比如把.title { font-weight: 500; }改成body .title { font-weight: 500; } - H5 页面特别容易中招：大字体包（如 10MB 的 .ttf）异步加载完成前，浏览器用系统字体临时渲染（此时
font-weight可能有效），加载完切回自定义字体后，因字重缺失立刻“变细”——这时直接删掉自定义字体，靠系统字体 + 合理font-weight反而更稳
打印样式或移动端加粗失败？字体家族必须锁死
打印预览里 font-weight: bold 失效，大概率是因为浏览器在打印时悄悄换掉了你的字体（比如换成 Times New Roman），而该字体根本不支持 bold 渲染。
- 打印媒体查询里必须强制指定一个「已知支持多字重」的无衬线字体：
@media print {
.bold-row {
font-family: Arial, 'Helvetica Neue', sans-serif !important;
font-weight: 700 !important;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
}-
安卓 WebView 对
font-weight解析极不稳定，尤其老版本。实测有效的兜底方案：用text-shadow: 0.1px 0 0 currentColor模拟加粗感（慎用于正文，仅限小范围强调） - Chrome / Safari 对
font-weight: 100等极细字重支持差，MDN 明确说：“对只有 normal/bold 的字体，100–500 全当 400 渲染”——别硬刚，换字体或换设计
font 简写属性里 font-weight 失效？漏写了 font-family
font 是简写属性，语法要求严格：font: [font-style] [font-variant] [font-weight] [font-size]/[line-height] [font-family]。其中 font-size 和 font-family 是必需项，缺一不可。
立即学习“前端免费学习笔记（深入）”；
- 下面这行会失效（浏览器忽略整个声明，或 fallback 到默认字体）：
.selector { font: 500 16px; }- 正确写法必须带字体名：
.selector { font: 500 16px 'Segoe UI', sans-serif; }- 如果想用系统字体栈又怕写错，直接拆开写更安全：
font-weight: 500; font-size: 16px;
字体粗细不是 CSS 单方面能决定的事——它卡在字体文件、浏览器匹配算法、加载时机、甚至打印引擎之间。最省事的解法，永远是先查 DevTools 里的 Computed Styles，再顺着字体名反向验证资源是否存在。别猜，直接看浏览器到底用了哪个文件、哪个字重。
