示例文章:长内容的响应式排版
展示长文、目录与表格的基本排版示例,公开上线前应换成真实内容。
文章目录
示例内容:用于展示桌面与移动端文章排版,不是个人作品或经验陈述。
阅读宽度与行距
长文需要稳定的行宽和舒适的行距。屏幕变窄时,版面应自然收缩,而不是缩小字体来容纳更多文字。
表格和代码块
宽内容可以在局部容器内滚动,以便在窄屏继续浏览,同时不撑宽整页。
| 场景 | 行为 |
|---|---|
| 宽屏文章 | 正文旁可显示目录 |
| 窄屏文章 | 目录折叠到正文之前 |
目录与标题
文章目录和标题锚点应来自同一份标题数据,避免目录标签与实际位置不一致。