直接在中给body设font-family和font-size可覆盖多数文本，但必须加通用字体族兜底（如sans-serif），否则中文在macos/linux会fallback至难看宋体；且需显式声明button、input等元素字体，因其ua样式会覆盖body设置。
直接在 <style></style> 里给 body 设 font-family 和 font-size，就能覆盖绝大多数文本元素——但必须加通用字体族兜底，否则中文在 macOS 或 Linux 上大概率 fallback 到难看的默认宋体。
为什么只写 body { font-family: "Microsoft YaHei"; } 不行
浏览器不会自动把 h1、button、input 的字体继承自 body，除非它们本身没定义字体。很多内置元素（比如 button）有 UA 样式强制设了 font-family: -webkit-system-font 或类似值，会覆盖 body 设置。
- 真正生效的是给
body, button, input, select, textarea, th, td等显式统一声明 - 中文字体名必须用引号包裹，例如
"Microsoft YaHei"，否则含空格时解析失败 - 末尾必须带通用族名，如
sans-serif，否则 iOS Safari 可能渲染为 Times New Roman
font-family 字体栈怎么写才跨平台一致
单纯列 "Microsoft YaHei", "Helvetica Neue" 会导致中西文分裂：macOS 没微软雅黑，直接跳到 Helvetica Neue（西文），中文却 fallback 到系统默认宋体——结果一行字两种风格。
- 推荐用系统字体栈：
-apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif - 顺序很重要：iOS/macOS 优先用
-apple-system，Windows 用"Segoe UI"，国产系统靠后兜底 - 避免混用中英专有字体（如
"Noto Sans SC", Arial），Noto Sans SC 在 Windows 默认不预装，Arial 又不支持中文
全局字号该用 px 还是 rem
如果项目不需要适配缩放或无障碍字体调节，px 最稳；但只要用户在系统设置里调大了“显示大小”或启用了“粗体文本”，rem 才能响应变化。
- 用
rem时，必须先重置html根元素字号，例如html { font-size: 16px; }，否则各浏览器默认值不一（Chrome 是 16px，Firefox 可能是 17px） - 别在
body里写font-size: 1rem就完事——要同步改button、input等，否则它们仍按 UA 默认字号渲染 -
px虽然简单，但在 iOS「更大字体」辅助功能下完全不放大，可能违反 WCAG 1.4.4
最常被忽略的一点：CSS 优先级。哪怕你写了 body { font-family: ... }，只要某个组件库的 CSS 文件在后面加载，且用了 !important 或更具体的选择器（比如 div p），你的全局设置就失效了。检查方式很简单：打开 DevTools，选中任意段落文字，在 Styles 面板里看 font-family 哪条声明被划掉——被划掉的就是被覆盖的。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
