优化段落打印效果需用专用CSS：统一黑白高对比度、12pt字号、1.4～1.6行高、2em首行缩进；禁用text-shadow与透明度；设page-break-inside: avoid防止分页截断；特殊元素如blockquote、列表、代码块需针对性样式调整。

段落标签（<p>）在打印时容易出现行距过小、首行缩进缺失、页内截断突兀等问题。优化关键不是重写HTML结构，而是用打印专用CSS精准控制其表现。

统一字体与颜色，确保黑白可读

屏幕显示的灰色文字或浅色背景，在打印中可能模糊不清甚至消失。段落必须使用高对比度组合：

• 强制设置 color: #000; 和 background-color: #fff;，避免依赖默认值
• 字号建议用物理单位：如 font-size: 12pt;（约等于16px），比 rem 或 px 更稳定
• 禁用 text-shadow 和透明度，它们在多数打印机上无效或导致文字发虚

调整行高与段间距，提升纸质阅读舒适度

屏幕上紧凑的行距在纸上会显得拥挤。打印段落需更宽松的垂直节奏：

Article To Html

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

下载

• 设 line-height: 1.4～1.6，避免固定像素值（如 line-height: 20px）在不同设备渲染不一致
• 用 margin-top 和 margin-bottom 替代 padding 控制段间空隙，更符合纸张排版习惯
• 中文段落可加 text-indent: 2em;（注意：em 在打印中较可靠，因基于当前 font-size；也可用 text-indent: 24pt; 更绝对）

防止分页撕裂段落内容

一个段落被硬生生切在两页之间，会严重影响可读性。需主动干预分页逻辑：

立即学习“前端免费学习笔记（深入）”；

• 给 p 添加 page-break-inside: avoid;，阻止浏览器在段落中间断开
• 若段落前有标题（如 <h2>），可对标题设 page-break-after: avoid;，确保标题与后续段落不分离
• 避免对 p 使用 float 或 display: inline-block，这些在打印引擎中支持差，易引发布局错乱

处理特殊段落：引用、列表与代码块

普通 <p> 之外，还需兼顾语义化变体：

• <blockquote> 建议加左边界线和缩进：border-left: 3px solid #000; padding-left: 12pt; margin: 12pt 0;
• <ul>/<ol> 内的 li 段落，统一用 margin-bottom: 6pt; 替代默认上下边距，避免空行过多
• <pre><code> 类段落必须指定等宽字体栈：font-family: "Courier New", Consolas, monospace;，并设 font-size: 10pt;