HTML表格标签本身未变，差异源于CSS默认值调整（如border-collapse）、HTML5语义化要求（需thead/tbody）及辅助技术规范强化，修复应聚焦CSS重置、结构补全与可访问性适配。
HTML 表格标签 <table> 在旧版和新版中其实没变
<p>浏览器对 <code><table>、<code><tr>、<code><td> 等基础表格元素的解析逻辑二十年来基本一致，所谓“旧版 vs 新版格式差异”，实际是开发者混用了过时写法、CSS 重置行为、以及 HTML5 语义化要求带来的感知差异。
<ul><li>HTML5 仍完全支持 <code><table border="1"> 这类内联属性，但<strong>不推荐</strong>——不是因为失效，而是会被现代 CSS 重置（如 <code>border-collapse: collapse 默认值变化）覆盖或干扰
<th align="center">，现在浏览器仍能渲染，但 <code>align 属性在 HTML5 中已废弃，W3C 不再验证，部分 Linter（如 HTMLHint）会报 attr-deprecated
<caption></caption> 位置没变，但辅助技术（如屏幕阅读器）对它的语义依赖更强了；漏写或放错位置（比如塞进 <tbody> 里）会导致可访问性检测失败
<h3>真正影响渲染的其实是 CSS 的默认行为变化</h3>
<p>Chrome/Firefox/Edge 自 2020 年起陆续将表格的 <code>border-collapse 默认值从 separate 改为 collapse（Safari 仍为 separate），这导致同一份 HTML 在不同浏览器里边框“看起来不一样”——不是 HTML 变了，是 CSS 基准变了。
- 旧项目若依赖
border="1"且没设 CSS，可能在新 Chrome 里出现“无间隙双线”错觉，实际是collapse合并了相邻边框 - 修复方式不是改 HTML，而是显式声明：
table { border-collapse: separate; border-spacing: 2px; } - 用
display: table模拟表格布局时，border-spacing对伪元素无效，这点容易被忽略
HTML5 要求的语义化结构必须补全
旧 HTML 允许直接写 <table><tr><td>…</td></tr></table>，但 HTML5 规范要求：有表头行时，必须包裹 <thead>；主体内容应放在 <code><tbody>；脚注用 <code><tfoot>。不写不会报错，但会影响 DOM 树结构、打印样式、以及某些 JS 库（如 DataTables）的自动识别。
<ul><li>错误写法：<code><table>
<tr><th>Name</th></tr>
<tr><td>Alice</td></tr>
</table> —— 缺 <thead> 和 <code><tbody>
<li>正确写法：<code><table>
<thead><tr><th>Name</th></tr></thead>
<tbody><tr><td>Alice</td></tr></tbody>
</table>
<tbody> 即使只有一个，也不能省略；否则 Safari 在动态插入行时可能触发重排异常
<h3>兼容性陷阱：自定义单元格尺寸与 <code>colspan/rowspan
当混合使用 width 内联属性、CSS min-width 和 colspan 时，各浏览器计算逻辑不一致——这不是 HTML 版本问题，而是 layout engine 实现差异长期存在的事实。
立即学习“前端免费学习笔记（深入）”；
- Firefox 对
<td colspan="2" width="200"> 会优先按 width 分配，Chrome 更倾向按列平均分配后再缩放 <li>解决办法：放弃 <code>width属性，改用 CSScol元素控制列宽：<col style="width: 120px"> <col style="width: 80px"> -
rowspan跨行单元格在 Flex 或 Grid 布局容器中会失效（因为表格子元素脱离文档流），这点常被当成“HTML5 不支持 rowspan”——其实是父容器 display 类型冲突
表格结构本身没升级，但周边环境（CSS 默认值、语义规范、JS 生态）已经悄然收紧。最容易被忽略的是：你以为在修 HTML，实际要调的是 CSS + DOM 结构 + 辅助技术兼容三者的交集。
