排版与字体（Typography）决定文字的可读性与气质。基础内容包括：字体分类、字号层级、行高行距、中英混排。中文语境下还要特别注意中西文字体的搭配与字体栈（font stack）。

字体四大分类

分类	特征	代表字体	适用场景
衬线 Serif	笔画末端有装饰性"衬线"	Times New Roman、Georgia、宋体	印刷、长文、正式/传统气质
无衬线 Sans-serif	无衬线、字形简洁	Helvetica、Inter、黑体、苹方、微软雅黑、思源黑体	屏幕、UI、现代/中性气质
等宽 Monospace	每个字符宽度相同	Courier、Consolas、JetBrains Mono	代码、数据表、终端
手写/装饰 Script & Display	高度风格化、醒目	书法体、展示标题字体	标题点缀、海报、品牌，慎用于正文

中文字体对应关系：衬线 ≈ 宋体/明朝体；无衬线 ≈ 黑体/苹方/微软雅黑/思源黑体（Noto Sans CJK）。中文衬线在屏幕小字号下笔画易发虚，正文优先无衬线。

字号层级（Type Scale）

• 原则：以正文为基准，标题按比例放大（常见 1.25-2.0 倍递进），注释适当缩小，形成清晰的层级节奏。
• 示例：正文 16px → 小标题 20-24px → 大标题 32-48px → 展示标题 64px 及以上。
• 要点：同一文档内层级控制在 3-4 级；用字重（Light/Regular/Medium/Bold）辅助区分，而非只靠字号。

常见字号-字重对照：

层级	字号参考	字重	用途
展示标题	48-64px+	Bold(700)	主视觉、首屏大标题
大标题 H1	32-40px	Bold(700)	页面/章节标题
小标题 H2-H3	20-28px	SemiBold/Medium(500-600)	小节标题、卡片标题
正文 Body	14-18px	Regular(400)	主要阅读内容
辅助/注释	12-13px	Regular(400)	图注、时间、版权

行高与行距

• 行高 line-height：正文建议 1.4-1.8（中文常取 1.5-2.0）；过小文字挤成一团，过大则行间断裂。
• 行宽 measure：中文每行约 30-40 字、英文约 45-75 字符较舒适；行越宽越需要更大的行高补偿。
• 字距：中文正文用默认字距即可；标题可适当加字距提升气质，但不要破坏字间连接。

中英混排

• 字体栈顺序：中文字体在前、西文字体在后，如 "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif——英文与数字优先命中西文字体，渲染更精致。
• 空格习惯：中英文/数字之间加半角空格（或在设计工具中用自动间距），避免文字贴在一起。
• 统一回退：以 system-ui 起步的字体栈可跨 Windows/macOS/Android/iOS 保持一致的降级渲染。

常见误区

• 字体种类过多：同一版面超过 3 种字体就是杂乱；改用同一字体家族的不同字重更安全。
• 忽略行高：默认行高 + 长段落 = 可读性灾难。
• 中文套用英文规则：直接复制西文 font stack，中文回退到宋体导致风格割裂。
• 正文滥用装饰字体：装饰/手写字体只用于标题点缀，正文以保证可读性优先。

一句话总结

排版先立 3-4 级字号层级、正文行高 1.4-1.8 就能撑住可读性；中文排版的关键是字体栈中文在前、西文在后，同一字族的多个字重比堆字体更安全。

关联概念

• 层级与留白：设计原则-视觉层级与留白（字号层级是层级工具之一）
• 强调与对比：设计原则-对比对齐重复亲密性（字体对比是 CRAP 对比的重要维度）
• 生成文字排版描述：提示词工程-基础与框架