HTML5已废弃table的align="center"，因其实际使表格变为inline-table导致居中不可靠；可靠方法是CSS设置margin:0 auto并指定width（如width:80%或max-width:800px）。
HTML 表格本身没有原生的 align="center" 居中语义（HTML5 已废弃该属性），真正可靠的方式是用 CSS 控制：对 <table> 设置 margin: 0 auto，并确保它不是 inline 元素。
为什么 align="center" 在 table 上失效或不推荐
HTML5 明确废弃了 table 标签的 align 属性；即使某些浏览器仍能渲染，它实际作用的是表格在行内环境中的对齐（类似文本对齐），而非“块级居中”，且行为不可预测。更严重的是，它会让表格变成 display: inline-table，导致 width 和 margin 失效。
- 现象：
<table align="center">在 Chrome/Firefox 中可能看似居中，但在 Safari 或严格模式下完全不生效 - 本质：它等价于
style="display: inline-table; text-align: center;"，父容器需有text-align: center才“看起来”居中，但这是误导 - 替代方案：一律用 CSS，语义清晰、可控性强、符合现代标准
最稳妥的居中写法：margin: 0 auto + 块级显示
这是最常用、兼容性最好（IE8+）、逻辑最直接的方法：让 <table> 成为块级元素，并通过左右自动外边距实现水平居中。
- 必须给
<table>显式设置display: block或保留默认display: table（它本就是块级上下文中的块级框） - 关键：添加
margin-left: auto; margin-right: auto;，简写为margin: 0 auto - 注意：
width需为具体值（如width: 80%或width: 600px），否则automargin 无效（因为无收缩基准）
<table style="margin: 0 auto; width: 80%;"> <tr><td>A</td><td>B</td></tr> </table>
如果表格要响应式居中，别忘加 max-width
纯 width: 100% 会让表格撑满父容器，失去“居中感”；而固定像素宽度又不适应小屏。更合理的做法是限制最大宽度，并允许在宽屏下居中、窄屏下自然缩放。
立即学习“前端免费学习笔记（深入）”；
- 推荐组合：
width: 100%; max-width: 800px; margin: 0 auto; - 这样在屏幕 > 800px 时，表格以 800px 居中；≤ 800px 时，自动缩为 100% 宽度，依然保持内容可读
- 避免用
display: flex父容器居中——虽然可行，但会破坏表格的固有布局流，可能导致colspan/rowspan渲染异常或打印样式错乱
内联单元格内容居中 ≠ 表格整体居中
新手常混淆两个概念：text-align: center 控制的是单元格内文字/内容的对齐，和表格在页面中的位置无关。
- 错误写法：
<table style="text-align: center;">→ 这只让所有<td>文字居中，表格本身仍靠左 - 正确分工：
margin: 0 auto管表格定位，text-align/vertical-align管单元格内部对齐 - 若需整表垂直居中（如页面中央），需父容器配合
display: flex; align-items: center; justify-content: center;，但注意这属于布局层级问题，不是表格自身属性
真正容易被忽略的一点：表格居中依赖于父容器的宽度是否明确。如果父容器是 position: absolute 或浮动后未清除，或者用了 display: inline-block 且未设 text-align: center，margin: 0 auto 就会静默失败——调试时优先检查父级宽度计算是否正常。
