一个 index.html 文件即可实现可读性强的简历页：语义化 html 结构（header/main/section/h2）、响应式 viewport 声明、相对字号与行高、无障碍邮箱链接、print 媒体查询适配、github pages 路径与大小写规范。
用纯 HTML + 少量 CSS 快速搭出可读性强的简历页
不需要框架、不依赖模板，一个 index.html 文件就能跑起来——关键不是“好看”，而是让招聘方 3 秒内扫到你的姓名、联系方式、核心技能和最近一段经历。HTML 结构必须语义清晰，<section></section> 和 <h2></h2> 要比一堆 <div> 更可靠。
<ul>
<li>用 <code><header></header> 包姓名和联系信息，<main></main> 分块放「教育」「工作经历」「技能」，每块用 <section></section> + <h2></h2>
style="..."），把 CSS 写在 <style></style> 标签里，控制宽度、行高、间距即可，比如 max-width: 800px 防止文字撑满屏幕@#@#@#@#@#@#@#@#@#@0
让简历在手机上不缩放也能正常阅读
很多本地打开的 HTML 简历在手机 Safari 或 Chrome 里文字极小，是因为缺少 viewport 声明。这不是样式问题，是 HTML 头部没配对。
- 必须在
里加这行：<meta name="viewport" content="width=device-width, initial-scale=1"> - 别用固定像素字号（如
font-size: 16px），改用相对单位：font-size: 1rem或1.1em，配合body { line-height: 1.6; }提升可读性 - 避免用
<table> 排版时间线或技能栏——表格在小屏上会横向溢出，用 <code><dl> <dt></dt> <dd></dd> </dl>或带flex-wrap的<div> 更稳 <h3>导出 PDF 时格式错乱？重点检查这三处</h3> <p>Chrome “另存为 PDF” 是最常用方式，但默认会删掉背景色、截断长内容、忽略某些 margin。不是代码错了，是打印样式没适配。</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/ai/2249" title="超级简历WonderCV"><img src="https://img.php.cn/upload/ai_manual/000/000/000/175679998691134.png" alt="超级简历WonderCV" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/ai/2249" title="超级简历WonderCV" class="overflowclass">超级简历WonderCV</a> <p class="overflowclass">一款AI办公效率工具，主要用于免费求职简历模版下载制作，应届生职场人必备简历制作神器，适合需要提升相关任务效率的用户。</p> </div> <a rel="nofollow" href="/ai/2249" title="超级简历WonderCV" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <ul> <li>加一段 <code>@media print规则：重置background为白色，color为黑色，去掉所有box-shadow和border - 避免用
position: fixed或float布局——PDF 导出引擎对它们支持极差，会导致内容重叠或消失 - 如果经历条目多，给
<section></section>加break-inside: avoid;，防止某段经历被硬生生切到两页
部署到 GitHub Pages 后样式丢失？查路径和大小写
本地双击打开没问题，一上传到 github.io 就变纯文字——90% 是资源路径写死了，剩下 10% 是文件名大小写不符（Windows 不敏感，Linux 敏感）。
- CSS 如果写在单独文件里（比如
style.css），引用必须用相对路径：<link rel="stylesheet" href="style.css">，不要写./style.css或/style.css - 检查文件名：GitHub Pages 默认服务器是区分大小写的，
Style.CSS和style.css是两个文件 - 如果用了图标字体（如 Font Awesome），优先用 CDN 地址而非本地文件，避免跨域或路径问题；但注意 CDN 可能被墙，稳妥起见还是用 SVG 内联图标
真正难的不是写完，而是每次更新后重新验证三件事：手机预览是否折行、PDF 导出是否分页合理、GitHub 页面是否加载了 CSS——这三个环节任何一处断掉，简历就等于没发出去。
