layui表头文字默认垂直居中靠padding上下相等实现，推荐设.layui-table-th > div { padding: 8px 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }并配合列配置minwidth，避免直接设置height或line-height。
layui table 表头文字垂直居中怎么设
默认情况下，layui 表头 th 的文字是**水平居中 + 垂直居中**的（靠 line-height 和 padding 配合实现），但一旦你自定义了 height、line-height 或覆盖了 padding，垂直居中就极易失效——尤其在加了背景色或边框后，肉眼一看就偏上或偏下。
真正可控的方式是：**不碰 height 和 line-height，只调 padding，并确保上下 padding 相等**。Layui 2.8+ 内部用的是 padding: 0 12px（上下为 0），所以只要保持上下一致，比如改成 padding: 8px 12px，就能稳住垂直居中。
- 别写
height: 40px; line-height: 40px—— 这在多行文本、字体渲染差异、缩放场景下会失准 - 如果用了
skin: 'line'或'nob'，表头th > div是实际承载文字的容器，要改它的padding，不是直接改th - 检查开发者工具里
.layui-table-th > div的 computedheight和line-height是否匹配；不匹配就说明有样式干扰
为什么只设 white-space: nowrap 后文字还是换行了
因为 white-space: nowrap 只禁用「软换行」，但若 th 没有明确宽度约束，浏览器仍可能因内容过长触发「强制折行」（尤其含长串数字或无空格英文）。更关键的是：Layui 的 th 是 display: table-cell，它对 white-space 的响应依赖于父级表格布局是否稳定。
- 必须配合
minWidth（列配置项）或显式width，否则white-space: nowrap形同虚设 - 不要只在 CSS 里写
.layui-table th { white-space: nowrap; }—— 它会被.layui-table-th > div的内联样式覆盖 - 生效的写法是：
.layui-table-th > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
如何让表头文字既不换行又垂直居中
这两个需求必须一起处理，否则容易顾此失彼：设了 white-space: nowrap 但没控好高度，文字就顶到上边；强行拉高 th 又导致 line-height 失效，垂直位置飘移。
- 给表格容器加自定义 class，例如
class="my-table" - CSS 中写：
.my-table .layui-table-th > div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 8px 12px; /* 上下相等，保垂直居中 */ } - 列配置里每列都设
minWidth（如{field: 'name', title: '姓名', minWidth: 100}），否则省略号不触发 - 避免给
.layui-table-th直接设height或line-height—— 它们会破坏div的自然居中逻辑
容易被忽略的兼容点和陷阱
IE11 下 text-overflow: ellipsis 在 table-cell 子元素里支持极差，即使套了 div 也常不显示省略号；另外，如果你启用了 fixed: true（固定列），表头和内容列的 div 结构略有不同，需额外加选择器：
- 固定列的表头实际结构是
.layui-table-fixed-l .layui-table-th > div，得单独写规则 - 动态重载数据后（如
table.reload()），CSS 依然生效，但若列宽被 JS 重算过，需手动调table.resize()确保minWidth生效 - 如果表头用了
templet自定义，那垂直居中逻辑就转移到你写的 HTML 里，此时要自己保证内层元素有对齐样式
