vertical-align 是唯一可靠方式，valign 已废弃；它对齐行框中心而非单元格中点，多行文本需 padding 微调或改用 flex；仅对 table-cell 元素生效，caption 应用 caption-side 替代 valign。
vertical-align 是唯一可靠方式，valign 已失效
HTML5 中 valign 属性（如 <td valign="middle">）已被正式废弃，现代浏览器虽可能兼容，但一旦遇到 <code>display: flex、line-height 或任何 CSS vertical-align 规则，它就会被直接忽略。你看到“没生效”，大概率不是写错了，而是被覆盖了。
-
valign不是“绝对居中”，它只在行内上下文起作用，对多行文本或带 padding 的单元格效果不可靠 - IE8–IE11 要求
td必须有显式height或line-height，否则vertical-align: middle会退化为baseline - 服务器端控件（如 ASP.NET 的
HtmlTableCell.VAlign）仍暴露该属性，但最终渲染时仍转为 CSS，不改变前端行为
vertical-align: middle 看起来偏高？这是正常现象
vertical-align: middle 对齐的是“行框（line box）的中心”，不是单元格高度的数学中点。当单元格内容是多行文本、图标混排或字体 line-height 不一致时，视觉上常显得偏上——这不是 bug，是规范定义的行为。
- 单行文本 + 固定高度单元格：可设
line-height: 100px（等于height）模拟居中，但仅限纯文本场景 - 多行文本或图文混排：必须配合
padding-top手动微调，或改用display: flex布局（需重写结构） - 安全做法：给
td设固定height，再加对称padding，例如height: 80px; padding: 24px 12px;，留出 32px 给内容自然居中
text-align 和 vertical-align 别混用对象
text-align 控制水平对齐，vertical-align 控制垂直对齐，但二者生效范围完全不同：
-
text-align可用于table、tr、td、th，对块级容器内文本有效 -
vertical-align**只对td、th、tr或display: table-cell元素生效**；写在table上无效 - 常见错误：
table { vertical-align: middle; }—— 这条规则完全不起作用 - 推荐写法：
td, th { vertical-align: middle; }，配合统一height或padding
CAPTION 的 VALIGN 是特例，但也不推荐用
<caption></caption> 标签确实还支持 valign="top" 或 valign="bottom"，用来把标题放在表格上方或下方。但它和单元格的 valign 不是一回事，且同样属于废弃属性。
- 现代写法应使用 CSS：
caption { caption-side: bottom; }替代valign="bottom" -
caption-side兼容性极好（Chrome 1+、Firefox 1+、Safari 1.3+），且语义清晰 - 如果必须兼容 IE7/8，才考虑保留
valign，但这类场景现在极少
vertical-align 对齐的是“行框”而非“内容盒”。哪怕设了 height 和 vertical-align: middle，只要字体、line-height 或内容结构稍有变化，视觉重心就可能偏移——这时候靠 padding 微调，比硬抠 line-height 更实际。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
