html简历不应使用表格，因其语义不清、响应式差、可访问性弱；应优先采用div+css grid/flex布局，仅在邮件内嵌等极少数场景下用table，且须严格遵循role="presentation"等可访问性规范。
HTML 表格不是现代简历的推荐载体——语义不清、响应式困难、屏幕阅读器支持差，且后期维护成本高。真正需要交付 HTML 简历时，应优先用 <div> + CSS Grid/Flex 布局；只有极少数场景（如邮件内嵌、老旧系统模板兼容）才需用 <code><table>，且必须严格遵循可访问性底线。
<h3>为什么 <code><table> 用在简历里容易出问题
<p>表格本质是表达「二维关系数据」，比如课程表、价格对比、财务报表。而简历是线性结构化文档：姓名、联系方式、教育经历、项目经验——这些是逻辑层级关系，不是行列映射关系。强行套用 <code><table> 会导致：
<ul>
<li>
<code>role="presentation" 必须显式添加，否则屏幕阅读器会逐行读“第1行第1列…”，完全破坏信息流
overflow-x: auto 无法优雅解决布局断裂<thead> 在跨页时不会自动重复（除非加 <code>@media print 特殊处理）
table-presentational 错误如果非要用 <table>，必须写的最小安全结构
<p>仅当对接内部 HR 系统或遗留邮件模板时才考虑。核心原则：视觉是表格，语义不是表格。必须满足以下三点：</p>
<ul><li>整个简历包裹在 <code><table role="presentation"> 中，且所有子 <code><tr>/<code><td> 不再有语义含义
<li>关键内容（如姓名、职位）仍要用语义化标签：<code><h1></h1>、<h2></h2>、<address></address>，不能只靠 <td> 的字体大小撑
<li>联系方式部分必须用 <code><a href="tel:..."></a> 和 <a href="mailto:..."></a>，不能写纯文本
示例片段：
张三前端开发工程师 |
| +86 138-0013-8000｜ zhangsan@example.com |
<table> 简历里最容易被忽略的可访问性细节
<p>即使加了 <code>role="presentation"，仍可能被辅助技术误读。以下三项必须手动检查：
-
<caption></caption> 标签绝对不能出现——它会给表格赋予语义标题，与 role="presentation" 冲突
- 所有
<th> 必须删掉，换成 <code><td>；哪怕看起来像“栏目名”，也不能用 <code><th>，否则会被读作“表头”
<li>避免嵌套表格；若真要实现两栏布局（如左栏技能、右栏项目），用单层 <code><table> + <code>colspan/rowspan 控制，不要 <table><table><p>最后提醒：任何用 <code><table> 实现的简历，在 Chrome DevTools 的 Accessibility 面板中检查时，“AX Tree” 应完全不出现 <code>table、row、cell 节点——只看到 document → heading → link → paragraph 这类语义节点，才算过关。
<caption></caption> 标签绝对不能出现——它会给表格赋予语义标题，与 role="presentation" 冲突<th> 必须删掉，换成 <code><td>；哪怕看起来像“栏目名”，也不能用 <code><th>，否则会被读作“表头”
<li>避免嵌套表格；若真要实现两栏布局（如左栏技能、右栏项目），用单层 <code><table> + <code>colspan/rowspan 控制，不要 <table><table><p>最后提醒：任何用 <code><table> 实现的简历，在 Chrome DevTools 的 Accessibility 面板中检查时，“AX Tree” 应完全不出现 <code>table、row、cell 节点——只看到 document → heading → link → paragraph 这类语义节点，才算过关。
