font-weight 必须作用于 th 和 td 元素，取值为 100–900 整百数，但实际生效取决于字体是否支持对应字重；系统字体通常仅支持 400/700；应避免对 table 统一设置，而用 th{font-weight:700}、td{font-weight:400} 分开控制，并推荐使用 CSS 变量统一管理。
直接用 font-weight 控制，但别乱填数字
表格里文字加粗，核心就一条：font-weight 属性必须作用在实际渲染文本的元素上——也就是 th 和 td，不是 tr 或 col。浏览器只认有限几个值：normal（≈400）、bold（≈700），以及整百数 100–900。但关键在于：这些数值是否生效，取决于你用的字体文件本身有没有提供对应字重。系统字体（如 system-ui、Segoe UI）通常只有 400 和 700 两档，填 550 或 620 基本等于白写，浏览器会就近取整后 fallback 到 400。
th 和 td 必须分开设 font-weight
表头和数据单元格语义不同，粗细理应区分。直接写 table { font-weight: bold; } 看似省事，但会导致所有单元格（包括嵌套内容）一并加粗，容易破坏按钮、链接等内联控件的视觉层级。更稳妥的做法是：
-
th { font-weight: 700; }—— 表头强制加粗 -
td { font-weight: 400; }—— 数据默认正常粗细 - 若某列需特殊处理（如金额列要更轻），可用属性选择器：
td[data-type="amount"] { font-weight: 300; }（前提是字体真支持 300）
用 CSS 变量统一管理，避免硬编码
硬写 font-weight: 600 在十处地方，后期想调成 500 就得全局搜改。用 CSS 变量能一次改到处，也方便主题切换：
body {
--fw-regular: 400;
--fw-semibold: 600;
--fw-bold: 700;
}
th { font-weight: var(--fw-bold); }
td.status-ok { font-weight: var(--fw-semibold); }
变量名带 fw- 前缀，一眼可知用途；值仍选标准档位（400/600/700），不写非整百数。如果用了自定义 Web 字体（如 Inter），务必检查其 @font-face 声明里是否真包含 font-weight: 600，否则变量再规范也没用。
立即学习“前端免费学习笔记（深入）”；
遇到 font-weight 不生效？先查字体支持，再看继承链
最常见假象是 CSS 写对了，文字就是不加粗。优先排查这两点：
- 打开 DevTools → Elements → 选中目标
td→ 查看 Computed 面板里的font-weight值，确认是否被其他样式覆盖（比如某个重置 CSS 把td设成了font-weight: normal !important） - 点击该值右侧的字体名（如
"Inter", sans-serif），跳转到 Fonts 面板，确认该字体是否真加载了对应字重文件（例如 Inter-600.woff2 是否存在且状态为 200） - 注意
lighter和bolder是相对计算，依赖父级font-weight值，容易失控，线上环境慎用
真正麻烦的是那些混用 <font> 标签和 inline style 的老表格——它们可能干扰 CSS 层叠顺序，得先清理或显式覆盖，而不是指望一个 font-weight 规则通吃。
