不用框架。HTML简历只需本地打开、GitHub Pages部署、ATS抓取和手机扫码可用,Bootstrap等框架体积大、影响打印和移动端,Pure.css(4.5KB)更轻量稳妥;推荐零框架+CSS变量手写样式,精准可控且符合ATS要求。

用不用框架,先看你的简历要跑在哪
HTML简历不是网站,它不需要路由、状态管理或组件通信。如果你的目标是:本地双击打开能看、GitHub Pages部署能用、ATS系统能抓取关键词、手机扫二维码不缩放——那绝大多数前端框架都是负累。Bootstrap 3 的 container 和 row 类确实能快速对齐,但它的 CSS 文件体积(压缩后仍超 20KB)、默认的全局样式重置、以及对 float 的遗留依赖,反而会让打印预览错乱、移动端文字挤成一团。
Pure.css 是目前最稳妥的轻量选择
雅虎开源的 Pure.css 只有 4.5KB(gzip 后),提供 pure-g 网格、pure-table 和基础表单样式,不侵入你的语义结构。它不强制你用 class="pure-u-1-2" 套布局,你可以只引入 pure-min.css,再自己写几行 Flexbox 规则控制简历模块间距。关键优势在于:@media print 下几乎零冲突,所有背景色和边框默认可被打印样式覆盖;没有 JavaScript 依赖,不会因 CDN 加载失败导致页面白屏;lang="zh-CN" 下中文字体继承稳定,不像某些框架硬塞 font-family: "Helvetica Neue" 导致中文渲染发虚。
别碰“简历生成器”打包的框架
很多所谓“一键生成 HTML 简历”的工具,底层偷偷集成了 jQuery + Bootstrap 4+ + FontAwesome 三件套,总资源体积轻松突破 300KB。后果很直接:
- GitHub Pages 首屏加载超过 2 秒,HR 在地铁里点开就放弃
-
fontawesome-webfont.woff2请求失败时,技能图标变成方块,ATS 系统把整段<i class="fab fa-react"></i>当作乱码跳过 - 用
data-aos加滚动动画?打印 PDF 时所有transform元素消失,工作经历只剩标题 - 模板导出的
index.html里混着内联style="margin-top: 2rem;",你根本没法统一改字号
真正推荐的搭配:零框架 + 手写 CSS 变量
与其选框架,不如用原生能力控住核心变量。在 <style></style> 里定义:
立即学习“前端免费学习笔记(深入)”;
:root {
--primary-color: #2E8B57;
--section-gap: 1.8rem;
--text-size: 1.05rem;
}
section { margin-bottom: var(--section-gap); }
time { color: var(--primary-color); }
@media (max-width: 600px) {
:root { --text-size: 1rem; --section-gap: 1.4rem; }
}
这种写法比任何框架都轻、都可控。改主题色只需动一行;适配小屏靠媒体查询切换变量值;所有字体大小用 rem,避免 iOS Safari 缩放失灵;连 ATS 都能正常读取 <time datetime="2022-03"></time> 里的结构化时间——这才是简历该有的技术诚实。
复杂点在于:你得亲手写 print 媒体查询,得手动测试 iPhone 上邮箱链接是否可点击,得确认 GitHub Pages 路径大小写是否一致。这些事框架不会替你扛,但每一件,都直接决定 HR 是多看三秒,还是立刻划走。



















