最简可用表格只需、、、四个标签，必须嵌套正确、列数对齐，仅用于表头，border="1"确保边框可靠渲染，为可访问性必需且位置严格。
怎么用 <table> 搭出最简数据结构
<p>不需要任何 CSS，只要 4 个标签就能跑起来：<code><table>、<code><tr>、<code><th>、<code><td>。别套 <code><thead> 或 <code><tbody>——那是语义增强用的，不是“能用”的前提。
<p>常见错误是把 <code><tr> 直接塞进 <code>，浏览器会自动补 <table>，但 DOM 结构不可靠，后续加样式或 JS 绑定容易失效。
<ul><li><code><th> 只用于表头行（第一行），它默认加粗+居中，比用 <code><td> + <code>style="font-weight:bold" 更语义、更轻量
<tr> 必须在 <code><table> 内部，哪怕只有一行数据
<li>列数必须对齐：第二行 <code><td> 个数 ≠ 第一行 <code><th> 个数，表格会错位，但不会报错，肉眼难察觉
<h3>
<code>colspan 和 rowspan 合并单元格时最容易漏的约束
合并不是“画线连起来”那么简单。colspan 是横向合并，rowspan 是纵向合并，但它们生效的前提是：被合并的单元格原本就该存在。
比如你想让第一行第一个单元格跨两列，写 <th colspan="2">姓名/年龄</th>，那这一行后面就只能再放一个 <th>（总共 2 列），否则列总数会超；如果硬多写一个，浏览器会把它当新列渲染，导致错行。
<ul>
<li>
<code>colspan="3" 表示“占 3 个原始列位置”，不是“合并后显示为 3 格宽”
rowspan="2" 的单元格所在行之后，下一行对应位置必须留空（即不放 <td>），否则会被挤到右边
<li>不要混用：<code><td rowspan="2" colspan="2"> 是合法的，但调试时建议先单侧测试，避免行列错位叠加
<h3>为什么加 <code>border="1" 而不是直接写 CSS
新手常以为加 style="border:1px solid #000" 更现代，但实际在纯 HTML 阶段，border="1" 更可靠——它强制触发浏览器的表格边框渲染逻辑，而 inline CSS 的 border 在某些旧环境（如邮件客户端、部分终端渲染器）里可能被忽略或重置。
更关键的是：border="1" 自动启用 border-collapse: collapse 效果，单元格边框不重叠；而手动写 CSS 时若漏掉这句，会出现双线边框，且 cellspacing 属性失效。
-
border="0"不等于“没边框”，而是“关闭边框渲染逻辑”，此时即使写style="border:1px"也可能不生效 - 如果真要用 CSS 控制，务必同时加
style="border-collapse: collapse"，否则td之间会有默认间隙 -
cellpadding和cellspacing是 HTML 属性，仅对border="1"环境有效；换成 CSS 后就得用padding和border-spacing
<caption></caption> 不是装饰，是可访问性刚需
很多人把 <caption></caption> 当成标题标签随便放，但它实际是表格的“唯一官方描述”，屏幕阅读器靠它识别表格用途。没它，辅助技术用户根本不知道这个表格是“员工名单”还是“菜单价格”。
位置必须紧贴 <table> 开始标签之后，不能套在 <code><div> 里，也不能放在 <code><thead> 前面——否则语义断裂，部分读屏软件会跳过。
<ul>
<li>
<code><caption></caption> 内容应简洁说明表格目的，例如 <caption>6月销售统计（按区域）</caption>，而不是“销售数据表”
align 属性控制（已废弃），如需左对齐，得用 CSS：caption { text-align: left; }
<table> 只能有一个 <code><caption></caption>，重复会导致验证失败，部分浏览器静默忽略第二个
表格真正难的不是写标签，而是判断哪一行该用 <th scope="row">、哪一列该用 <code><th scope="col">——这关系到数据关联是否被机器正确理解。但对简单清单来说，先保证结构不出错，比追求完美语义更实际。</th>
