html简历能根治排版失控、更新反人性、展示维度单一三大问题：内容与样式分离确保跨平台一致，语义化结构+响应式设计提升可访问性，原生交互与轻量部署增强hr触达效率。
HTML简历不是为了“显得会写代码”，而是它在真实求职场景中，能同时解决三个文档类简历无法根治的问题：排版失控、更新反人性、展示维度单一。
为什么Word/PDF简历在发出去后就“不听使唤”了
你调好行距、字体、页边距，导出PDF时第一页多出半行空白；HR用Mac打开，中文默认字体变成华文细黑，字号全乱；想改个邮箱，得重开文件、重新导出、重新命名、重新上传——每次微小修改都像重启一次流程。
HTML+CSS把内容和样式彻底拆开：h1只管“这是主标题”，font-size和line-height全在CSS里定义。浏览器渲染逻辑稳定，只要不用太激进的CSS特性（比如contain: paint或@layer），Chrome/Firefox/Safari在桌面端显示几乎一致。
- 避免用
margin-top硬推标题位置，改用section语义分块 +gap控制间距 - 字体别写
"微软雅黑"，优先用system-ui或"-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif" - 导出PDF时别依赖浏览器“另存为”，用
print media query单独写一套@media print规则，隐藏导航栏、按钮等非内容元素
为什么在线简历链接比附件更让HR愿意点开
招聘系统自动解析附件简历时，Word容易丢格式、PDF可能被OCR识别错字、图片型PDF直接失败；但一个HTML页面，只要服务器开着，curl -I就能看到状态码200，head -n 20就能扫到meta name="description"里的核心信息。
更重要的是：它天然支持“轻量交互”。比如在“项目经历”里嵌一个@#@#@#@#@#@#@#@#@#@0，比写“详见GitHub”多出至少3倍点击率；用details/summary收起技术栈详情，既保持页面清爽，又让懂行的人能展开验证。
- 别用
onclick="window.open(...)"写跳转，原生a标签更可靠、SEO友好、移动端点击区域也更大 - 所有外部链接加
rel="noopener noreferrer"，防止安全漏洞 - 如果放作品截图，用
srcset配picture做响应式，别只扔一张1920px宽图拖慢手机加载
为什么自己手写HTML比套模板网站更可控
模板网站导出的HTML，90%以上带内联style、冗余div嵌套、硬编码字体路径，甚至偷偷加统计脚本。你想删掉右下角那个“Powered by XXX”水印？得付费升级，或者手动扒DOM结构，一不小心就崩版。
而自己写的HTML，从DOCTYPE开始就是干净的。你可以精确控制每个section是否在打印时出现，可以给“技能”栏加data-level="85"属性，后续用JavaScript生成进度条——这些都不是炫技，是为可能的自动化筛选留接口。
- 别用
float做两栏布局，用display: grid配minmax(0, 1fr)更稳 - 简历里不需要框架，
fetch、Promise、IntersectionObserver这些API现代浏览器全支持，够用 - 部署别折腾服务器，
gh-pages分支 +index.html根目录，连域名都不用买，username.github.io/resume直接可访问
真正难的不是写出来，而是想清楚哪些地方该“死守”（比如联系方式必须一眼可见）、哪些地方该“留白”（比如技能描述别堆满术语）。一份HTML简历的完成度，不取决于用了多少CSS新特性，而在于它有没有让一个3秒扫视的HR，准确抓住你是谁、你能干啥、怎么联系你。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
