用 font-family 指定字体，但别只写一个名字
浏览器不会“猜”你想要什么字体，它只会按顺序找系统里有没有。只写 "微软雅黑"，在 macOS 或 Linux 上大概率 fallback 到默认无衬线体，文字可能突然变细、行高错乱。
- 必须提供备选字体链，例如：
font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif; - 中文字体名带空格或中文，一定要加英文引号；英文字体如
Helvetica可不加，但加了更稳妥 - 结尾的
sans-serif不是可有可无——它是兜底，没它就可能触发浏览器默认 serif 行为（尤其旧版 IE） - 避免用
@font-face加载字体时漏掉font-display: swap;，否则文字会闪白或长时间不可见
font-size 别死磕像素值，优先用 rem 或 em
写 font-size: 14px; 看似简单，但用户缩放页面、系统设置大字体、iOS 强制最小字号时，它就卡死了——文字要么小到看不清，要么撑破容器。
-
rem基于根元素html的font-size，适合全局响应式控制 -
em相对父级，适合组件内缩放（比如按钮文字随图标大小联动） - 移动端慎用
vw做字号，横屏时字体会突然巨大，且 iOS Safari 对小vw值渲染不稳定 - 绝对单位
px只在 icon font、固定尺寸徽标等极少数场景下合理
行高 line-height 不设单位才真“继承”
写 line-height: 24px; 或 line-height: 1.5em; 看似正常，但子元素继承后会变成固定像素值，一旦字号变化，行高就错位甚至重叠。
- 纯数字（如
line-height: 1.6;）才是推荐写法——它表示“倍数”，子元素用自己字号 × 这个数 - 中英文混排时，
1.5可能不够：汉字字形高、标点下沉，建议至少1.6起步，长段落可到1.75 - 别给
line-height设!important，它极易被后代元素意外覆盖，调试时难溯源
字体粗细 font-weight 数字值不是所有字体都支持
写了 font-weight: 600; 却没变粗？不是 CSS 失效，而是当前字体文件根本没包含这个字重。浏览器只能就近匹配，有时直接回落到 400（常规）。
立即学习“前端免费学习笔记（深入）”；
- 查字体支持的字重范围：用浏览器 DevTools 的 Fonts 面板，或访问字体官网文档（如思源黑体支持 300/400/500/700）
- 避免依赖
font-weight: bold;，它等价于700，但有些字体只有400和900两级 - 自定义字体用
@font-face时，必须为每个字重单独声明src，不能靠浏览器“合成”粗体（合成效果糊、锯齿重）
