表格文字不继承body字体是因为th、td被更高权重样式覆盖、浏览器默认样式干预或行内样式强制指定；需显式设置table, th, td { font-family: "Segoe UI", "Microsoft YaHei", sans-serif; font-size: 14px; line-height: 1.5; }并重置th的font-weight。
直接给 <body> 设置 font-family 和 font-size，表格文字就会继承——但别指望它能覆盖所有例外，尤其是 <th>、<td> 或内联样式里显式声明的字体。
为什么BODY字体没生效到表格里？
常见现象是：你写了 body { font-family: "Microsoft YaHei", sans-serif; }，但表格里的字还是 Times New Roman 或默认等宽字体。原因通常有三个：
-
<table>或其子元素（如<th>、<td>）被其他 CSS 规则显式设置了font-family，且权重更高（比如用了!important，或选择器更具体） - 浏览器默认样式表对
<th>有特殊处理（部分浏览器会默认加粗 + 独立字体），导致它不完全继承body - HTML 中存在行内
style属性，例如<td style="font-family: monospace">，它会直接覆盖外部样式
最稳妥的全局字体写法：table, th, td 一起重置
不要只靠 body，直接锚定表格结构本身。这样既明确、又避免继承断裂：
table,
th,
td {
font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
font-size: 14px;
line-height: 1.5;
}
说明：
立即学习“前端免费学习笔记（深入）”；
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
table控制整体容器，th和td覆盖单元格内容，三者并列确保无遗漏 - 把
font-family列成备选链，优先用现代 UI 字体，最后兜底sans-serif，避免中文字体缺失时回退到难看的衬线体 - 加上
line-height是为了防止表格行高塌陷，尤其在设置小字号时容易挤在一起
遇到 font-weight 异常粗/细？检查 th 默认加粗行为
即使你设了 font-family 和 font-size，<th> 文字仍可能比 <td> 明显粗——这不是 bug，是浏览器默认样式：th { font-weight: bold; }。
解决办法很简单：
- 如果想统一粗细，显式重置：
th { font-weight: normal; }或th { font-weight: 400; } - 如果保留加粗但控制程度，用数值代替关键字：
font-weight: 600;比bold更可控，尤其在 variable font 场景下 - 注意：某些字体（如部分思源黑体变体）对
font-weight的响应不敏感，此时需确认字体文件是否包含对应字重
内联样式和 JS 动态插入内容会绕过全局设置
哪怕你把 CSS 写得再完整，以下两类情况仍会失效：
- HTML 中硬编码的
<td style="font-family: 'Courier New'>—— 行内样式优先级高于外部规则，必须手动删掉或用!important覆盖（不推荐） - JS 生成的表格内容（如
cell.innerHTML = "<span style='font-size:12px'>xxx</span>"）—— 字体控制权已移交到内层元素，全局规则无法穿透
真正要“全局”生效，就得从源头控制输出逻辑：要么让 JS 不写内联样式，要么在插入后统一遍历 td 元素清除 style.fontFamily 属性。
