chinese-typography

# 中文排版助手 **中文网页丑，八成不是设计问题，是排版问题。** 大部分模板是按西文设计的，直接拿来放中文，会同时踩到十几个坑：行高不够、中英挤在一起、标点占位不对、断行断在不该断的地方。 ## 什么时候用 网页/文章/公众号/PDF/Word/PPT 的中文排版，选字体，中英混排，修"说不上哪里丑"的中文页面。 ## 第一步：确认载体 不同载体规则差别大： | 载体 | 关键差异 | |------|---------| | **网页** | 可用 CSS 控制，字体要考虑加载 | | **公众号** | 内联样式，字体受限，宽度固定 | | **Word/PDF** | 首行缩进传统，字号用磅 | | **PPT** | 字号大、行数少、对比强 | ## 中文排版的 10 条核心规则 ### 1. 中英文之间加空格（盘古之白） ``` ❌ 我用Python写了一个爬虫 ✅ 我用 Python 写了一个爬虫 ``` **数字同理**：`3 个苹果`、`iPhone 15 Pro` 例外：**标点旁边不加**——`使用 Python，然后……`（逗号前不加） ### 2. 行高要比西文大 中文字符方正饱满，行高不够会挤成一团。 ```css line-height: 1.75; /* 正文，1.6-1.8 都可以 */ line-height: 1.35; /* 大标题可以紧一些 */ ``` > 西文常用的 1.4-1.5 放中文会显得压抑。 ### 3. 字体栈要写对 ```css font-family: -apple-system, BlinkMacSystemFont, /* 苹方 / SF */ "Segoe UI", Roboto, /* 西文优先 */ "PingFang SC", "Hiragino Sans GB", /* 苹果中文 */ "Microsoft YaHei", "微软雅黑", /* Windows */ "Source Han Sans SC", "Noto Sans CJK SC", /* 思源 */ sans-serif; ``` **顺序原则**：西文字体放前面，中文字体放后面。这样英文用西文字体渲染，中文自动 fallback，混排更好看。 **衬线（正文长阅读 / 文艺感）**： ```css font-family: "Songti SC", "SimSun", "Noto Serif SC", Georgia, serif; ``` ### 4. 标点：全角还是半角 | 场景 | 用法 | |------|------| | 中文句子 | **全角**：，。？！：；""'' | | 英文句子 | **半角**：, . ? ! : ; " ' | | 中文句中的英文 | 英文内部用半角，句子结束用全角句号 | **括号**：中文内容用全角（），英文内容用半角 () **省略号**：中文用 `……`（六点），不是 `...` **破折号**：中文用 `——`（两个），不是 `--` ### 5. 引号 - 简体大陆规范：`""` 和 `''` - 港台 / 文艺排版：`「」` 和 `『』` **统一即可，不要混用。** ### 6. CJK 断行控制 ```css word-break: normal; /* 不要用 break-...