表格错位、边框消失、对齐异常的根源在于默认样式干扰和嵌套结构错误；必须用<tr>包裹<td>/<th>，禁止单独嵌套，且需用CSS设置border和border-collapse:collapse，并区分<th>（居中加粗）与<td>（左对齐）的语义及样式。
<table> 标签本身不难，但实际写出来经常错位、边框消失、文字对不齐——核心问题不在会不会写，而在默认样式干扰和嵌套逻辑没理清。
表格基本结构必须包含 <tr>、<td> 或 <th>
很多人只写 <table><td>姓名</td></table>，浏览器会尝试“修复”，但结果不可控。真实渲染依赖严格的行容器：<tr> 是必须的，<td>（普通单元格）和 <th>（表头单元格，自带加粗+居中）不能直接挂在 <table> 下。
正确写法示例：
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>28</td>
</tr>
</table>
-
<th>建议只用于第一行或首列，语义上表示标题，屏幕阅读器会识别 - 少用
colspan/rowspan初期，容易导致后续<tr>列数计算错乱 - 空单元格别留空白，写
<td> </td>或<td></td>都行，但不要只换行不写标签
没有边框？不是代码错，是 CSS 默认把边框设为 0
写了 <table> 却看不到线，不是 HTML 错了，是浏览器默认 border: 0 + border-collapse: separate。想立刻看到边框，最简方式是在 <table> 上加内联样式：
立即学习“前端免费学习笔记（深入）”；
<table style="border: 1px solid #000; border-collapse: collapse;">
-
border-collapse: collapse让相邻边框合并，否则会出现双线间隙 - 单独给
<td>加border也行，但必须每格都加，且collapse才能统一 - 现代项目建议用外部 CSS 控制，但调试阶段内联最直觉
文字靠左/居中不对？优先查 text-align 和 <th> 的默认行为
<th> 默认 text-align: center，<td> 默认 left。如果整表要居中，别在每个 <td> 上重复写样式，改父级：
<table style="text-align: center;">
- 这个设置会被
<th>继承，所以表头依然居中，内容也居中了 - 若只要某列右对齐（比如数字列），给该列所有
<td>加style="text-align: right;"，或者用<col>标签配合 class 控制（进阶但更干净） - 避免用
<center>或align="center"属性，HTML5 已废弃
真正麻烦的不是写几行 <table>，而是后期加样式时发现 <th> 的加粗和居中和你想要的排版冲突，或者合并单元格后某一行突然多出空隙——这时候回看是否漏了 <tr>、是否 border-collapse 没生效，比重写整个表格更快。
