Layui表格列对齐必须在cols数组中为单列配置align，如align: 'right'，不支持全局CSS设置；可选值仅left/center/right；配合style微调间距，空单元格在Firefox中需特殊处理。
layui table 的 align 配置只对单列生效，不是全局样式
很多人试过在 table.render() 外层加 css 或给整个表格设 text-align: right，结果所有列都右对齐了——这不对。layui 表格的列对齐必须落到具体某列的配置项上，靠 css 覆盖容易失效或影响其他列。
正确做法是在列定义（cols 数组）里，给目标列加上 align: 'right'：
table.render({
elem: '#demo',
cols: [[
{field: 'id', title: 'ID', width: 80},
{field: 'username', title: '用户名', align: 'right'}, // ✅ 只这一列右对齐
{field: 'email', title: '邮箱'}
]]
});
-
align可选值只有'left'、'center'、'right'，不支持'end'或 CSS 里的flex-end - 如果列用了
templet自定义内容，align仍会作用于该列容器，但内部 HTML 若有text-align会优先级更高，可能覆盖掉 - 数字类字段（如金额、序号）建议显式加
align: 'right'，避免和中文混排时视觉错位
用 style 配合 align 微调文字位置更稳妥
单纯靠 align: 'right' 有时不够：比如数字带千分位逗号、负号在前，或者单元格内有图标+文字组合，右对齐后空隙难控制。这时候得补一层内联样式。
在列配置中用 style 字段直接写 CSS，它会加到该列每个 <td> 上：
<pre class="brush:php;toolbar:false;">{field: 'price', title: '价格', align: 'right', style: 'padding-right: 12px;'}</pre>
<ul>
<li>
<code>style 是字符串，不是对象，别写成 style: {paddingRight: '12px'}
text-align 在 style 里重复声明，会和 align 冲突；优先用 align 控制对齐，style 只管间距/颜色等辅助样式templet + 等宽字体 + text-align: right 模拟，但这已超出单列对齐范畴动态列或后台返回列结构时，align 必须在服务端或 JS 组装阶段注入
如果你的 cols 是从接口拿的，比如后端返回字段列表，那 align: 'right' 不能靠前端“事后补”，因为 table.render() 读取的是初始数组快照。
- 推荐在请求回来后、调用
table.render()前，用 JS 遍历列数组，按字段名匹配并插入align： cols[0].forEach(col => { if (col.field === 'amount') col.align = 'right'; });- 别在
done回调里改列配置——此时表格已渲染完，再改无效 - 如果列是响应式生成（比如拖拽排序后重绘），每次重绘都要重新注入
align，否则会丢失
注意 Firefox 下 align: 'right' 对空单元格可能不生效
Firefox 渲染表格时，若某单元格内容为空（null、undefined 或空字符串），align: 'right' 有时不触发，看起来像左对齐。这不是 bug，是浏览器对空内容的默认处理差异。
- 临时解法：在
templet或后端返回数据时，把空值转成' '（非断行空格） - 更稳的做法：用
style强制设置text-align: right !important，但仅限必要列，避免污染 - 这个现象在 Chrome / Edge 里通常不出现，所以本地测完还得切浏览器验证
列对齐看着简单，但跨浏览器、动态列、自定义模板这三块最容易漏掉细节。尤其是空值和 templet 共存时，光靠 align 不够，得配合 style 或数据预处理。
