纯HTML+内联CSS可打印简历需：①所有样式写在<style>中，用基础盒模型和字体控制；②禁用外部资源，仅保留<meta charset="utf-8">和<meta name="robots" content="noindex">；③@page设0.4in边距，section加break-inside: avoid；④字体用系统栈并分离中英文，禁用背景图形导出。
用纯 HTML + 内联 CSS 生成可直接打印的简历
不需要框架、不引入外部样式表、不依赖 JavaScript —— 纯靠 <html> + <style> 就能输出干净、无广告、无追踪、适配 A4 打印的简历。关键在于：所有样式写在 <style> 里，且只用最基础的盒模型和字体控制。
常见错误是套用 Bootstrap 或 Tailwind 模板，结果带了一堆没用的 class、响应式断点、甚至内联脚本；或者用 Markdown 转 HTML 工具，生成一堆 <div class="markdown-body"> 这类冗余 wrapper。
- 只用
<section>、<h2>、<p>、<ul>（注意：此处<ul>是语义必需，不算杂质） - 字体统一设为
font-family: "Segoe UI", "Helvetica Neue", sans-serif;，避免系统缺失字体导致回退到等宽或乱码 - 打印前加
@media print规则，隐藏页眉页脚、链接下划线、背景色：@media print { a { text-decoration: none; color: #000; } body { margin: 0; padding: 0; } @page { margin: 0.5in; } }
如何让简历在 Chrome / Edge 打印时不出现在第二页顶部留白
这是最常被忽略的排版断裂点：浏览器默认 @page 有边距，且段落 margin-bottom 在分页时会“撑开”空白。不是内容太多，而是 CSS 没做分页控制。
- 给
<body>设margin: 0，并显式声明@page { margin: 0.4in; }（0.4in ≈ 1cm，比默认 0.6in 更紧凑） - 所有
<section>后加break-inside: avoid;，防止教育经历被切成两半 - 避免用
min-height或flex: 1填满页面——它们在打印时行为不可控；改用固定行高 + 显式高度估算（如line-height: 1.4; font-size: 12px;下，一页约容 48 行）
去掉所有隐性“杂质”：meta、script、第三方字体
所谓“纯净”，不只是视觉干净，更是源码干净、无副作用。很多简历 HTML 文件开头塞了 <meta name="viewport">、<script> 统计代码、Google Fonts 的 <link> —— 这些对打印毫无意义，还可能触发网络请求或字体加载失败。
立即学习“前端免费学习笔记（深入）”；
- 删掉全部
<script>和<link rel="stylesheet">（Google Fonts 必须放弃，用系统字体栈） - 只保留必要
<meta>：<meta charset="utf-8">和<meta name="robots" content="noindex">（防搜索引擎收录） - 如果必须强调某段文字（比如公司名），用
<strong>，别用<span style="font-weight:700">—— 语义清晰且体积更小
导出为 PDF 时字体发虚或中英文混排错位
根本原因：浏览器 PDF 导出器对子像素渲染和字体回退处理不一致。Chrome 默认用系统字体渲染，但导出 PDF 时可能降级为 Courier 或 Times，尤其遇到中文。
- 强制中英文字体分离：
font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; - 禁用字体平滑：
-webkit-font-smoothing: antialiased;（仅限 WebKit，不影响打印，但能统一预览效果） - 导出前按
Ctrl+P→ “更多设置” → 关闭“背景图形”（否则浅灰底色会变深灰，吃墨） - 真正保险的做法：用命令行
chromium --headless --print-to-pdf=resume.pdf resume.html，绕过 GUI 渲染差异
越想“纯净”，越要亲手控制每一处默认行为。字体、分页、导出链路——任何一个环节交给浏览器自动猜，杂质就藏进去了。
