HTML5 中 align 和 valign 已废弃，应改用 text-align: center 实现水平居中、vertical-align: middle 实现单元格内垂直居中，表格整体居中用 margin: 0 auto 或父容器 text-align: center。
align 和 valign 是 HTML 4 时代的原生属性，现在**不能用、不该用、不推荐用**——它们在 HTML5 中已被正式废弃，W3C 不再保证支持，验证工具会报错，部分 WebView 或无障碍工具会直接忽略。
为什么 align="center" 看似有效但实际危险？
本地测试时它可能“看起来”能居中，但问题藏在背后：
-
align属于表现层属性，与语义分离，违反现代 HTML/CSS 分离原则 - 一旦页面引入 CSS（哪怕只是重置样式），
align极易被覆盖且难以调试 - 在严格 DOCTYPE（
）下属于无效标记，某些构建工具或 CI 流程会直接失败 - 移动端 WebView（如某些安卓系统内置浏览器）对废弃属性兼容性差，上线后突然失效
text-align: center 才是单元格文字水平居中的唯一可靠方式
它作用于单元格内的行内内容（文本、<img alt="HTML表格文字怎么居中？align和valign属性介绍" >、<span></span>等），不是单元格本身：
- 对单个单元格：写
<td style="text-align: center;">内容</td> - 对整列：用
<col class="center-col">+ CSS.center-col { text-align: center; } - 对整张表：写
td, th { text-align: center; }，但注意它不会影响块级子元素（比如<div>） <li>如果单元格里放了 <code><div>，它默认是块级元素，<code>text-align对它无效——得单独给该<div> 设 <code>margin: 0 auto或用display: flexvertical-align: middle是垂直居中的正确写法它只对
<td> 和 <code><th> 生效，不能用于 <code><table> 或 <code><tr>：<p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p> <ul> <li>写法必须是 <code><td style="vertical-align: middle;">内容</td>或统一 CSStd, th { vertical-align: middle; } - 别指望
vertical-align能让多行文本“上下居中”——它只控制单元格内行框（line box）的对齐位置，对高度不固定的文本效果有限 - 若单元格内容是图片或单行文本，
vertical-align: middle通常足够；若含多段<p></p>或复杂布局，建议改用display: flex+align-items: center -
vertical-align的取值只有top/middle/bottom/baseline，没有center—— 写center是无效的
整个表格在页面中水平居中，不是靠 align，而是靠 margin: 0 auto
这个操作对象必须是 <table> 元素本身：
<ul><li>正确：<code><table style="margin: 0 auto;">，前提是 <code><table> 没有设 <code>width: 100% 或其他撑满父容器的规则
<td align="center"> 或给 <code><td> 加 <code>margin: 0 auto —— <td> 是 <code>display: table-cell，W3C 明确禁止对其设置 margin
<table> 包进一个 <code><div style="text-align: center;">，利用父容器的 <code>text-align 触发表格的“行内居中行为”（因为 <table> 默认是块级，但在 <code>text-align: center 的父容器中会被当行内块处理）
真正容易被忽略的点在于：居中不是单一属性的事。文字是否居中，取决于内容类型（行内 or 块级）、父容器 display 类型、CSS 继承链是否被意外中断——很多时候你以为改了 text-align 就完事，结果发现里面套了个 <div>，它自己没设宽度也没居中逻辑，就卡在那里不动。</div>
