align="center"在table上已失效，因HTML5移除该属性；应改用margin: 0 auto配合明确width实现居中，text-align控制单元格内容水平对齐，vertical-align控制单元格内垂直对齐。
align 属性在 <table> 或 <td> 上设置页面居中，已经完全失效 —— 不是“不推荐”，而是 HTML5 标准里被移除的语法，浏览器兼容性不可靠，验证器报错，无障碍支持断裂。
为什么 align="center" 在 <table> 上不管用
它实际触发的是 display: inline-table + text-align: center 的组合行为，依赖父容器有 text-align: center 才“看起来”居中。一旦父容器是默认 text-align: left，或用了 Flex/Grid 布局，表格就立刻靠左。Safari 和部分 WebView 直接忽略该属性。
-
<table align="center">等价于<table style="display: inline-table;">，而margin: 0 auto对inline-table无效 - 严格 DOCTYPE（如
<!DOCTYPE html>）下，该属性属于非法标记，HTML 验证失败 - 现代构建工具（如 Vite、Webpack）+ ESLint 插件会直接警告或报错
让整张表格在页面中水平居中：只用 margin: 0 auto
这是最稳定、兼容 IE8+、语义清晰的方案。关键不是加什么，而是避免什么：
- 必须给
<table>设置明确宽度（width: 600px、width: 80%或max-width: 800px），否则margin: 0 auto无基准可算 - 不要设
width: 100%—— 它会撑满父容器，左右没空余，automargin 失效 - 推荐写法：
<table style="margin: 0 auto; width: 100%; max-width: 800px;">，兼顾响应式与居中 - 确保
<table>是块级上下文（默认就是），不要被float、display: inline或父级flex干扰
让单元格内容水平居中：只用 text-align: center
text-align 控制的是单元格内部内容（文字、图片、行内元素）的水平位置，和表格本身在页面中的位置无关。常见误操作：
立即学习“前端免费学习笔记（深入）”；
- 写
<table style="text-align: center;">→ 只让所有<td>文字居中，表格仍靠左 - 对
<td>写margin: 0 auto→ 无效！<td>是display: table-cell，W3C 明确禁止设置margin - 单元格里放了
<div>却只设text-align: center→<div>是块级元素，不会被text-align影响，得单独设margin: 0 auto或用display: flex
垂直居中用 vertical-align: middle，但注意作用域
vertical-align 只对 <td> 和 <th> 有效，不能写在 <table> 或 <tr> 上。它控制的是单元格内容在行高范围内的垂直位置，不是整个表格在页面中垂直居中。
- 统一设置：
td, th { vertical-align: middle; } - 单个单元格：
<td style="vertical-align: middle;"> - 如果单元格内容是多行文本或图片，
vertical-align: middle仍可能因行高不一致导致视觉偏差，此时需配合line-height或padding微调 - 想让整张表格在视口垂直居中？那是父容器的事，要用
flex或grid，别折腾<table>自身
真正容易被忽略的点：表格语义没变，但布局逻辑已全由 CSS 掌控。align 是旧时代遗留的“快捷键”，现在它既不快也不键 —— 删除它，用 margin 控制位置，用 text-align 和 vertical-align 控制内容，才是稳住页面不崩的最小必要操作。
