html简历本质是交文档而非写网页，需用语义标签（如）、唯一姓名、内联样式、系统安全字体、max-width控制宽度、打印专用@media print样式覆盖flex等不兼容特性。
<div>，<code><h1></h1> 多写一次，或者漏了 style 属性，就可能被过滤或渲染失败。
为什么不能用 <div> 套简历模块
<p>屏幕阅读器和ATS（如Workday、Greenhouse）靠语义标签识别内容层级。<code><div class="experience"> 在它们眼里就是“一堆没意义的方块”，而 <code><section id="experience"></section> + <header><h2>工作经历</h2></header> 才会被解析为可索引的结构化数据。
-
<h1></h1> 必须且只能出现一次，内容必须是你的姓名；职位描述改用 <p></p> 或 <h2></h2>，别为了视觉压低标题级
- 联系方式不是页脚，别塞进
<footer></footer> ——它属于简历头部信息，紧贴 <h1></h1> 后或包在 <header></header> 里最安全
-
<ul></ul> 写技能列表完全合法，但别用三层 <div> 模拟列表项：体积大、无障碍差、ATS易跳过
<h3>内联样式怎么写才不被 Gmail / ATS 清空</h3>
<p>Gmail 会直接剥离 <code><style></style> 标签和所有外部 CSS；多数 ATS 只认行内 style 属性。指望 class 名或媒体查询？基本无效。
- 所有关键样式必须写进标签：比如
<p style="margin:0;padding:4px;font-size:14px;line-height:1.5;"></p>
- 字体强制用系统安全栈：
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; ——别写 "PingFang SC" 或 "Noto Sans CJK"（非通用名，Gmail 不认）
- 宽度锁死：
<main style="max-width:800px;margin:0 auto;"></main>，否则 Gmail 会自动缩放导致排版崩坏
- 链接必须显式定义颜色和下划线：
@#@#@#@#@#@#@#@#@#@0，否则默认灰+无下划线，HR 很可能看不见
导出 PDF 时中文乱码、flex 错位怎么办
Chrome 打印 PDF 的渲染引擎和网页不同：它不支持 display:flex、rem 单位不可靠、中文字体常 fallback 到空白方块。这不是你代码写错了，是上下文切换了。
- 加一段仅用于打印的
<style></style>，用 @media print 覆盖关键规则
- 中文字体必须显式声明：
@media print { body { font-family: "Noto Sans CJK SC", "Source Han Sans CN", sans-serif; } }
- 禁用弹性布局：
@media print section { display: block; margin-bottom: 16px; } ——别信 flex 在 PDF 里能正常工作
- 移除所有
transition、transform、animation，它们在 PDF 中无意义，还可能触发 Chrome 渲染 bug
最常被忽略的一点：简历是文档，不是响应式网站。你不需要 media query 适配手机，也不需要 JS 交互效果。删掉所有非必要东西，把结构语义、内联样式、打印专用字体这三件事做扎实，就已超过 90% 的求职者。
<h1></h1> 必须且只能出现一次，内容必须是你的姓名；职位描述改用 <p></p> 或 <h2></h2>，别为了视觉压低标题级<footer></footer> ——它属于简历头部信息，紧贴 <h1></h1> 后或包在 <header></header> 里最安全<ul></ul> 写技能列表完全合法，但别用三层 <div> 模拟列表项：体积大、无障碍差、ATS易跳过
<h3>内联样式怎么写才不被 Gmail / ATS 清空</h3>
<p>Gmail 会直接剥离 <code><style></style> 标签和所有外部 CSS；多数 ATS 只认行内 style 属性。指望 class 名或媒体查询？基本无效。
- 所有关键样式必须写进标签：比如
<p style="margin:0;padding:4px;font-size:14px;line-height:1.5;"></p> - 字体强制用系统安全栈：
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;——别写"PingFang SC"或"Noto Sans CJK"（非通用名，Gmail 不认） - 宽度锁死：
<main style="max-width:800px;margin:0 auto;"></main>，否则 Gmail 会自动缩放导致排版崩坏 - 链接必须显式定义颜色和下划线：
@#@#@#@#@#@#@#@#@#@0，否则默认灰+无下划线，HR 很可能看不见
导出 PDF 时中文乱码、flex 错位怎么办
Chrome 打印 PDF 的渲染引擎和网页不同：它不支持 display:flex、rem 单位不可靠、中文字体常 fallback 到空白方块。这不是你代码写错了，是上下文切换了。
- 加一段仅用于打印的
<style></style>，用@media print覆盖关键规则 - 中文字体必须显式声明：
@media print { body { font-family: "Noto Sans CJK SC", "Source Han Sans CN", sans-serif; } } - 禁用弹性布局：
@media print section { display: block; margin-bottom: 16px; }——别信 flex 在 PDF 里能正常工作 - 移除所有
transition、transform、animation，它们在 PDF 中无意义，还可能触发 Chrome 渲染 bug
