正文排版示例（富文本 HTML）

这是一篇用富文本编辑器写的示例文章，用来检查正文排版在前台的实际效果：段落、标题、列表、引用、表格和代码。

一、为什么要统一排版

同一个网站里，新闻、产品介绍和 AI 回答如果各用一套字号与行距，读者会觉得像在看几个不同的网站。统一之后，正文 16px、行高 1.8，标题分三级，层次靠字号和留白，而不是靠下划线。

1. 段落与留白

段落之间留出一行左右的间距；标题前多留一点、标题后收紧，读者一眼就能看出哪几段属于同一个小节。

这一段故意写得长一些，用来观察折行后的行距是否舒服。中文长段落最怕行距太紧，读到第三行就开始串行；也怕太松，一段话散成几行互不相干的句子。1.8 倍行高在 16px 的字号下，大约是 29px 的行距，屏幕阅读比较舒服。

2. 列表

• 无序列表的符号挂在文字外侧；
• 折行时，第二行与第一行的文字对齐，而不是缩到符号下面，这一条写长一点来看折行的效果；
• 列表项之间有少量间距，不会挤成一团。

1. 先写结论；
2. 再给依据；
3. 最后给出下一步建议。

二、引用与强调

好的排版，是让读者感觉不到排版的存在。

需要提醒读者注意的词可以用加粗；中文不使用斜体，因为中文字体没有真正的斜体字形，浏览器硬拧出来并不好看。

三、表格

档位	正文	一级标题	二级标题	三级标题
文章档	16px	26px	22px	18px
对话档	约 14px	20px	18px	16px

四、代码

行内代码像这样：npm run build。多行代码使用代码块：

npm install
npm run build
npm run start

---

更多内容可以回到 官网首页 查看。