纯html简历是最可控、加载最快、兼容性最强的选择，需用语义化标签（如）替代堆砌，禁用flex/grid布局以确保ats正确解析文本顺序，并通过@font-face引入中文字体、white-space和加固pdf导出效果。
纯 HTML 简历不是“凑合用”，而是最可控、加载最快、兼容性最强的选择——只要避开几个关键陷阱，它比 Word 或 PDF 更容易被 ATS（招聘系统）正确解析。
用语义化标签替代 <div> 堆砌
<p>很多简历用一堆 <code><div class="section"> 拼结构，ATS 和屏幕阅读器根本无法识别“这是教育经历”还是“项目经验”。必须用 <code><section></section>、<article></article>、<h2></h2>~<h3></h3> 明确层级。
-
<section></section> 包裹每一大块内容（如“工作经历”“技能”），内部用 <h2></h2> 作标题
- 每段工作/项目用
<article></article>，方便机器区分独立条目
- 避免
<div> 套 <code><div>，尤其别用 <code><div> 模拟标题或列表
<li>时间、公司名、职位这些关键字段，用 <code><time></time>、<strong></strong> 显式标注，比如：<time datetime="2022-03">2022.03–2024.06</time><strong>腾讯</strong><span>前端开发工程师</span>
不加 CSS 也能通过 ATS 扫描
ATS 不解析 CSS，只读 HTML 结构和文本顺序。一旦用 float、flex 或绝对定位打乱 DOM 顺序，简历内容可能被读成“技能：2023 项目：熟练 HTML”，顺序全乱。
- 禁用
display: flex / grid 布局简历主体结构（可用在小范围图标排版等非核心区域）
- 所有内容按阅读顺序从上到下写 HTML，别靠 CSS “视觉挪位置”
- 横向并列信息（如“React | Vue | TypeScript”）用
<span></span> + 竖线分隔，别用浮动或 inline-block 模拟“多列”
- 如果非要响应式，用媒体查询控制显隐，但确保未启用时 DOM 顺序仍合理
导出为 PDF 时字体和换行必须手动加固
浏览器“打印为 PDF”常把中文断行错乱、字体回退成宋体、甚至截断长链接——这不是样式问题，是 PDF 渲染引擎对 Web 字体和 white-space 处理不一致。
- 中文字体必须用
@font-face 引入可嵌入的开源字体（如 Noto Sans CJK SC），不能只靠 font-family: "PingFang SC"
- 关键字段（姓名、邮箱、电话）加
style="white-space: nowrap;" 防止折行
- 超长 URL 用
<wbr></wbr> 标注可断点，比如：https://github.com/username/repo<wbr>/tree/main</wbr>
- 打印前在 Chrome 开发者工具里切到“打印预览”，检查是否溢出或重叠——这步不能跳
真正卡住人的从来不是写不出 HTML，而是没意识到 ATS 怎么读你的标签、PDF 怎么崩你的换行、以及“看起来好看”和“机器能懂”之间那几行 <time></time> 和 <article></article> 的差别。
<section></section> 包裹每一大块内容（如“工作经历”“技能”），内部用 <h2></h2> 作标题<article></article>，方便机器区分独立条目<div> 套 <code><div>，尤其别用 <code><div> 模拟标题或列表
<li>时间、公司名、职位这些关键字段，用 <code><time></time>、<strong></strong> 显式标注，比如：<time datetime="2022-03">2022.03–2024.06</time><strong>腾讯</strong><span>前端开发工程师</span>
不加 CSS 也能通过 ATS 扫描
ATS 不解析 CSS，只读 HTML 结构和文本顺序。一旦用 float、flex 或绝对定位打乱 DOM 顺序，简历内容可能被读成“技能：2023 项目：熟练 HTML”，顺序全乱。
- 禁用
display: flex/grid布局简历主体结构（可用在小范围图标排版等非核心区域） - 所有内容按阅读顺序从上到下写 HTML，别靠 CSS “视觉挪位置”
- 横向并列信息（如“React | Vue | TypeScript”）用
<span></span>+ 竖线分隔，别用浮动或 inline-block 模拟“多列” - 如果非要响应式，用媒体查询控制显隐，但确保未启用时 DOM 顺序仍合理
导出为 PDF 时字体和换行必须手动加固
浏览器“打印为 PDF”常把中文断行错乱、字体回退成宋体、甚至截断长链接——这不是样式问题，是 PDF 渲染引擎对 Web 字体和 white-space 处理不一致。
- 中文字体必须用
@font-face引入可嵌入的开源字体（如Noto Sans CJK SC），不能只靠font-family: "PingFang SC" - 关键字段（姓名、邮箱、电话）加
style="white-space: nowrap;"防止折行 - 超长 URL 用
<wbr></wbr>标注可断点，比如：https://github.com/username/repo<wbr>/tree/main</wbr> - 打印前在 Chrome 开发者工具里切到“打印预览”，检查是否溢出或重叠——这步不能跳
真正卡住人的从来不是写不出 HTML，而是没意识到 ATS 怎么读你的标签、PDF 怎么崩你的换行、以及“看起来好看”和“机器能懂”之间那几行 <time></time> 和 <article></article> 的差别。
