直接在列配置中使用 cellstyle 函数返回含 'vertical-align': 'top' 的对象可控制单个单元格垂直对齐；必须严格遵循 css 属性名和字符串值规范，且每列需单独配置；响应式失效时可用 flex 布局兜底。
直接在列配置里写 cellstyle 函数，返回带 vertical-align 的对象，就能控制单个单元格的垂直对齐方式。别指望靠 css 类或全局配置生效，layui 表格不认这个。
cellStyle 必须返回含 vertical-align 的对象，不能写 verticalAlign
很多人写成 verticalAlign: 'top'，这完全无效——CSS 属性名是 vertical-align（带短横线），且值必须是字符串。Layui 会把返回对象合并进 <td> 的 <code>style 属性，所以必须严格按 CSS 写法来：
-
return { 'vertical-align': 'top' }✅ -
return { verticalAlign: 'top' }❌（JS 属性名错） -
return { 'vertical-align': top }❌（值没加引号） -
return null或{}❌（Layui 直接忽略）
每列都要单独配 cellStyle，不能只写一次
cellStyle 是列级函数，不是表格级配置。哪怕你只想让“操作列”顶端对齐，也得在该列定义里显式写：
{
field: 'operate',
title: '操作',
cellStyle: function(row, col) {
return { 'vertical-align': 'top' };
}
}
其他列如果不写 cellStyle，就继承表格默认的居中对齐（middle）。别想着在 table.render() 外层统一设——没这机制。
响应式下 vertical-align 失效？换 flex 布局兜底
当表格开启 height 固定高度、或在小屏下触发滚动时，vertical-align 可能失效——因为 Layui 内部用了 display: table-cell，而某些浏览器（尤其旧版 Safari 和 IE11）对 table-cell + vertical-align 在 flex 容器里的兼容性差。
这时更稳的办法是改用 flex 布局模拟对齐：
- 在
cellStyle里同时设：{ 'display': 'flex', 'align-items': 'flex-start' }（对应 top） - 或
{ 'display': 'flex', 'align-items': 'center' }（对应 middle） - 注意：加了
display: flex后，vertical-align就不起作用了，二者二选一 - 如果列里有复选框或开关组件，flex 布局下要额外加
margin-top: 2px微调基线，否则视觉上偏高
真正麻烦的不是怎么写代码，而是你得判断当前场景是否触发了 Layui 的内部渲染分支——比如固定列、合计行、树形表格这些特殊模式下，cellStyle 的执行时机和 DOM 结构都可能变化，vertical-align 更容易被覆盖。这时候别硬调样式，优先用 templet 自定义整个单元格 HTML，把对齐逻辑锁死在内容层内。
