纯html简历应优先使用语义化标签：个人信息用与组合，教育/工作经历用嵌套结构，技能列表用逗号分隔，确保ats可解析、屏幕阅读器友好且pdf导出稳定。
用纯 HTML 写简历表，核心是语义化结构而非样式
不需要 CSS 也能输出可读、可访问、能被搜索引擎和屏幕阅读器识别的简历——关键在标签选对。<section></section> 包个人信息，<h2></h2> 做小标题，<dl></dl><dt></dt><dd></dd> 组合最适合“姓名：张三”这类键值对。别用 <table>，它语义上是处理二维数据（如课程表），不是展示个人字段。
<h3>姓名、联系方式等基础字段怎么组织才不踩坑</h3>
<p>常见错误是全用 <code><p></p> 堆砌，导致结构松散、无法被解析工具提取。正确做法是用定义列表：<dl></dl> 容器，每个字段一对 <dt></dt>（术语）+ <dd></dd>（定义）。比如：
- 姓名
- 李四
- 邮箱
- li.si@example.com
- 电话
- 138-0013-8000
-
<a href="mailto:..."></a>和<a href="tel:..."></a>让邮件/电话可点击，移动端直接唤起对应应用 - 避免写死“微信：wxid_abc123”，应改为
<dt>微信</dt> <dd>wxid_abc123</dd>—— 没有交互需求时别强行加链接 - 地址建议拆成多行
<dd></dd>或用<br>，但不要用多个<p></p>，否则语义断裂
教育经历和工作经历用什么标签最稳妥
别用 <ul></ul> 或 <ol></ol>——它们表示“项目集合”，但每段经历本身是独立区块，含时间、机构、职位、描述多个子项。推荐嵌套结构：<section></section> 包一层，内部用 <h3></h3> 写学校/公司名，<time></time> 标时间（支持 datetime 属性），再跟 <p></p> 描述：
<section><h3>清华大学</h3> <time datetime="2018-09/2022-06">2018.09 – 2022.06</time><p>计算机科学与技术 学士</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> </section>
-
<time></time>的datetime值必须符合 ISO 8601（如2022-06），不能写“2022年6月”——否则失去机器可读性 - 如果经历有多个职位（如实习+正式），用多个
<section></section>，别塞进一个<div> <li>避免用 <code><h4></h4>或更低级标题做“专业技能”小类，统一用<h3></h3>保持层级清晰 - 长技能列表（如“JavaScript, TypeScript, React, Vue, Webpack, Vite…”）用
<ul></ul>易被截断，改用<span></span>+ 英文逗号分隔更稳 -
<pre class="brush:php;toolbar:false;"></pre>里的内容会强制保留空格和换行，简历里少用；需要代码片段才用它 - 避免在
<dd></dd>里嵌套<p></p>，可能导致 PDF 导出时多出空白行 - 如果必须加粗关键词（如“主导开发”），用
<strong></strong>而非<b></b>—— 前者有语义强调，后者只是视觉加粗
导出为 PDF 时字体/换行错乱？关键在打印样式控制
浏览器“另存为 PDF”默认忽略大部分 CSS，但 HTML 结构本身会影响分页和断行。容易出问题的点：
复杂点在于：纯 HTML 简历在不同浏览器 PDF 导出效果不一致，<section></section> 和 <time></time> 这些语义标签虽不影响显示，但决定了它能不能被 ATS（招聘系统）正确提取字段——这点常被忽略。
