valign 属性在 html5 中已废弃，应改用 css 的 vertical-align（单行文本）或 flex 布局（复杂内容），因其违反语义化、不响应式且 w3c 验证报错。
valign 属性在 <td> 中已失效 —— 它是 HTML 4 的废弃属性，现代浏览器虽仍能解析（出于兼容性），但不推荐使用，且在 HTML5 中完全不合法。
<h3>为什么 <code>valign 不该再用
HTML5 标准移除了所有表现型属性，valign 就是典型代表。它混杂结构与样式，违背语义化原则；更重要的是，它无法响应式控制、不支持 flex/grid 布局、不能被 CSS 选择器覆盖或继承。
- W3C 验证器会报错：
Attribute valign is obsolete. Use CSS instead. - 在
<table> 嵌套 <code><div> 或使用 <code>display: grid改写表格时，valign彻底失效 - IE8+ 虽支持，但 Safari 和 Chrome 对
valign="bottom"在百分比高度单元格中行为不一致 -
vertical-align: top≈valign="top" -
vertical-align: middle≈valign="middle" -
vertical-align: bottom≈valign="bottom" - 若需基线对齐（如含图标+文字），可用
vertical-align: baseline，这是valign没有的能力
CSS 替代方案：对齐单行文本最简方式
对纯文本内容的 <td>，用 <code>vertical-align 是最直接等效替代。注意：它只对 table-cell（即默认 <td>）、<code>inline、inline-block 元素生效。
示例：
<td style="vertical-align: middle;">居中文字</td>
复杂内容（多行/块级元素）怎么垂直居中
当 <td> 里有 <code><div>、<code><img> 或多段落时，vertical-align 会失效（因它只对“行内盒”起作用）。此时必须靠父容器（<td>）的布局能力：
<ul><li>设 <code><td> 为 <code>display: flex，再用 align-items: center —— 简洁可靠，IE11+ 支持
line-height 匹配 height（仅限单行文本）position: absolute + transform: translateY(-50%)，它破坏表格单元格的自动高度计算示例（flex 方案）：
<td style="display: flex; align-items: center; height: 80px;"> <div>任意高度内容</div> </td>
容易被忽略的关键点
vertical-align 的值不是相对于整个单元格，而是相对于“行框（line box）”的基线——这意味着如果单元格里有不同字号或行高的内容，middle 可能看起来偏高或偏低；flex 方案虽强，但一旦给 <table> 设了 <code>border-collapse: collapse，又没处理 padding，视觉对齐仍可能错位。
