真正开始排版需正确使用：每个应包裹逻辑完整的信息单元，不可仅作换行；须配合等语义元素，保持结构清晰；line-height用无单位值（如1.6），标题层级严格递进，唯一且包裹全部主内容。

用对

Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转

实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。

下载

才算真正开始排版

很多人把

当成换行工具，连续写三个

来“空行”，这会让语义彻底丢失，屏幕阅读器会念出三段空内容，SEO 也抓不到有效文本块。

• 每个
  必须包裹一个逻辑完整的信息单元，比如一句结论、一个现象描述、一个操作步骤
• 别在
  里塞标题或列表——
  和
  是兄弟关系，不是子元素
• 移动端下，
  默认 margin-top/margin-bottom 是浏览器设定的（通常约 1em），不要靠删 margin 来“压紧”文字，那会破坏可访问性缩放时的呼吸空间

line-height 设成无单位数字才是真稳定

写 line-height: 24px 看似精确，但一旦父级 font-size 变成 18px 或用户调大系统字号，行高就卡死不动，文字上下偏移、ascender/descender 粘连全由此来。

• 正文统一用 line-height: 1.6（配合 font-size: 16px）——这是浏览器默认、系统缩放兼容、移动端防强制放大的交集点
• 标题用 line-height: 1.4 配 font-size: 1.5em，保持比例关系，避免视觉节奏断裂
• 绝对不要在
  上设 line-height: normal，它依赖字体度量，不同字体渲染差异极大

标题层级崩掉，90% 是跳级或滥用

只能出现一次，且必须是文章主标题；

是一级子章节，

是二级——

后直接跟

就是典型崩塌。更隐蔽的问题是把整篇内容包进

，再在里面套一堆

，结果每个

都被解析器当成独立可分发单元，语义权重反超主文。

• 一篇文章只有一个
  ，它应直接包裹
  、导语、正文、作者信息等全部主内容
• 只用于内部逻辑分组，且每组必须有明确小标题（
  或
  ），不能光靠 class 名称“背景”“方法”来暗示结构
• 导语、作者栏这类辅助内容，用
  或
  ，别硬塞

混排中文字与西文时，letter-spacing 和 writing-mode 得分开控

中文和英文混排时，盲目加大 letter-spacing 会让汉字字距失衡，而强行用 writing-mode: vertical-rl 又会让数字和拉丁字母歪斜——这两者根本不是同一类问题。

• 纯中文段落慎用 letter-spacing，汉字本身已有字间留白；仅在标题强化或手写体防重叠时微调（建议 0.02em～0.05em）
• 竖排需求优先用 writing-mode: vertical-rl + text-orientation: mixed（保持数字/英文水平），别用 JS 拆字+绝对定位那种反模式
• 如果只是局部右对齐引用或签名，用 text-align: right 即可，不用动 writing-mode

实际排版最易被忽略的，是

的语义边界和

的唯一性——它们不决定样式，却决定了文字是否能被正确读取、索引和复用。样式可以重写，语义错位了，就得重构 DOM。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！