真实快速搭建底线是10分钟内实现手机可看、ATS可读、PDF可导出；需用语义化HTML结构（header/main/section/h2/dl/dt/dd）、mailto/tel协议链接、5处关键CSS（max-width居中、系统字体栈、图片自适应、print重置、break-inside避免分页断裂）及严格小写路径。
能用纯 HTML + 少量 CSS 在 10 分钟内跑起来，且手机能看、ATS 能读、PDF 能导出——这才是“快速搭建”的真实底线。别信“三行代码生成简历”的宣传，真快，是省掉调试错位、字体失效、打印空白这些坑的时间。
怎么写结构才不被 ATS 和手机浏览器同时抛弃？
ATS（招聘系统）和 Safari/Chrome 渲染引擎都依赖语义流，不是靠视觉对齐。用 <table> 或 float 布局，ATS 可能把你“技能”栏塞进“教育”时间里；手机上则直接横向溢出。
- 必须用
<header>包姓名+职位+一句话简介，<main>包所有内容块 - 每块经历、教育、技能都用独立
<section>，标题统一用<h2> - 时间线别用空格或竖线分隔，改用
<dl><dt>（时间）+<dd>（公司/学校/职位），这是唯一既语义清晰又方便 CSS 控制左右对齐的方案 - 邮箱和电话必须用
mailto:和tel:协议链接，别加 JS 加密或图片——ATS 读不到，iOS 点不开
CSS 只改这 5 处就能稳住屏幕+打印+手机
真正卡住进度的不是“怎么好看”，而是“为什么一导出 PDF 就丢背景、一横屏就滚动、一换字体就变宋体”。这些问题全集中在以下五处：
-
body必须设max-width: 800px和margin: 0 auto，禁用固定像素宽（如width: 960px） - 字体栈写成
font-family: "Segoe UI", system-ui, -apple-system, sans-serif，不依赖 Google Fonts，Windows/macOS/iOS 全兼容 - 图片加
max-width: 100%; height: auto;，删掉所有width="200"这类内联属性 - 加
@media print规则：重置background为white，color为black，隐藏非必要元素（如导航图标、社交链接） - 每段
<section>加break-inside: avoid;，防止某段工作经历被硬切到两页中间
本地双击能开，上传 GitHub Pages 就变白屏？查这三件事
不是代码错了，是路径和大小写在 Linux 服务器上露馅了。Windows 不敏感，GitHub Pages 敏感。
立即学习“前端免费学习笔记（深入）”；
- CSS 文件引用必须用
<link rel="stylesheet" href="style.css">，不能写./style.css或/style.css - 确认文件名全小写：
style.css≠Style.CSS，上传后右键“查看页面源码”，点开href链接看是否 404 - 如果用了本地字体或图片，路径也必须相对且小写，比如
images/photo.jpg，别写Images/Photo.JPG
最常被跳过的其实是 @media print 和 break-inside: avoid ——它们不决定“能不能看”，但决定“HR 打印出来时，你的第三段经历会不会只剩半句话在第一页底部”。
