HTML简历本质是交文档而非写网页，需用语义标签（如<section><header><h2>）、唯一<h1>姓名、内联样式、系统安全字体、max-width控制宽度、打印专用@media print样式覆盖flex等不兼容特性。
<div>，<h1> 多写一次，或者漏了 style 属性，就可能被过滤或渲染失败。
为什么不能用 <div> 套简历模块
屏幕阅读器和ATS（如Workday、Greenhouse）靠语义标签识别内容层级。<div class="experience"> 在它们眼里就是“一堆没意义的方块”，而 <section id="experience"> + <header><h2>工作经历</h2></header> 才会被解析为可索引的结构化数据。
-
<h1>必须且只能出现一次，内容必须是你的姓名；职位描述改用<p>或<h2>，别为了视觉压低标题级 - 联系方式不是页脚，别塞进
<footer>——它属于简历头部信息，紧贴<h1>后或包在<header>里最安全 -
<ul>写技能列表完全合法，但别用三层<div>模拟列表项：体积大、无障碍差、ATS易跳过
内联样式怎么写才不被 Gmail / ATS 清空
Gmail 会直接剥离 <style> 标签和所有外部 CSS；多数 ATS 只认行内 style 属性。指望 class 名或媒体查询？基本无效。
- 所有关键样式必须写进标签：比如
<p style="margin:0;padding:4px;font-size:14px;line-height:1.5;"> - 字体强制用系统安全栈：
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;">，否则 Gmail 会自动缩放导致排版崩坏 - 链接必须显式定义颜色和下划线：
<a href="mailto:x@y.z" style="color:#0066cc;text-decoration:underline;">x@y.z</a>，否则默认灰+无下划线，HR 很可能看不见
导出 PDF 时中文乱码、flex 错位怎么办
Chrome 打印 PDF 的渲染引擎和网页不同：它不支持 display:flex、rem 单位不可靠、中文字体常 fallback 到空白方块。这不是你代码写错了，是上下文切换了。
- 加一段仅用于打印的
<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
