vertical-align: middle 仅对 或 生效，因它只作用于行内盒；单元格需足够高度（用 padding 而非 height）、避免嵌套块级元素，否则须改用 flex 布局。

vertical-align: middle 必须作用在 或 上才有效，写在

或 上完全没反应。

为什么 vertical-align: middle 看似不生效

不是属性写错了，而是它对齐的“参考高度”被忽略了：

或

没有显式高度，又只有一行短文本时，内容撑开的高度太小，middle 和默认 baseline 视觉上几乎一样 单元格里嵌套了 、 等块级元素 —— vertical-align 对它们无效，只管单元格自身的“行内盒” 加了 line-height: 1 但没同步调高容器高度，导致文字被压扁，居中感消失 用了 border-collapse: collapse，边框重叠后视觉边界模糊，误判单元格实际范围 纯文本场景：用 text-align + vertical-align 组合 这是最轻量、兼容性最好的方案，适用于大多数传统表格： 必须同时设置：text-align: center（水平） + vertical-align: middle（垂直） 样式目标只能是	或	，不能是

避免设 height，改用 padding: 8px 12px 提供稳定对齐空间，更健壮

整表统一控制？写成：table td, table th { text-align: center; vertical-align: middle; }

含图片/按钮/多行内容：改用 display: flex

当

里塞了 、 或多个 HTML Text Extract 从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。 下载 ，vertical-align 就力不从心了： 给

加 display: flex; align-items: center; justify-content: center; 不需要固定 height，用 min-height: 40px 更安全，适配响应式 注意清除子元素默认 margin（比如 的上下边距），否则会撑开错位 Moodle 等受限环境也支持该写法，只要内联 style 可用（Chrome 29+/Firefox 20+ 均兼容） 别再用 valign="middle" 这个 HTML 属性已被 HTML5 废弃，现代项目中应彻底禁用： 它无法继承、无法复用，每个单元格都得手写一遍 React/Vue 等框架可能直接过滤掉该属性，样式丢失且无提示 一旦父容器用了 display: flex 或 grid，valign 立即失效 正确替代方案只有 CSS 的 vertical-align: middle，或升级为 Flex/Grid 布局 真正容易被忽略的是：垂直居中效果是否“可见”，取决于单元格是否有足够可用高度空间——不是靠硬设 height，而是靠 padding 或内容自然撑开；一旦里面嵌了块级元素，vertical-align 就自动退场，这时候必须切到 Flex 模式，没有中间路线。