layui弹窗内容居中需针对不同场景处理：字符串content用内联text-align:center；DOM元素提前设CSS；iframe页面需修改其body或容器样式；table列用align:'center'或templet包裹居中div，整表居中则加高权重CSS。
layui弹出层默认内容左对齐，若需让弹窗内部文字、按钮、表单元素等整体居中显示，不能依赖弹层容器的居中定位，而要控制内容区域自身的文本对齐与布局方式。
给弹窗内容区域添加 text-align: center
在调用 layer.open() 时，通过 content 传入字符串或 DOM 节点，确保其最外层容器有明确的居中样式。
方法一：直接内联 style（适合简单弹窗）→ 在 content 字符串里包裹一层带居中样式的 div：
content: '<div style="text-align:center;padding:20px;">
<p>操作成功！</p>
<button class="layui-btn">确定</button>
</div>'
方法二：使用已有 DOM 元素 → 给目标元素（如 #my-content）提前设置 CSS：
#my-content { text-align: center; }
【注意】仅设置父容器 text-align: center 不影响 flex 布局子项，若内容用了 display: flex，则需额外加 justify-content: center
处理 iframe 类型弹窗的内容居中
当 type: 2 加载外部页面时，弹窗自身居中了，但 iframe 内部页面仍可能靠左。这时必须修改被加载页面本身的样式。
在 iframe 页面的
<style>body { text-align: center; } .main-wrapper { display: inline-block; vertical-align: middle; </style>
或者更稳妥地，在 iframe 页面根元素上设 style="margin: 0 auto; text-align: center;"，并确保其宽度未占满 100% 导致失效。
用 cellStyle 或 templet 控制表格类弹窗单元格内容居中
若弹窗内嵌 layui.table，且希望某列文字居中，不能只靠外层弹窗居中——表格单元格默认不继承父级 text-align。
第一步：在列配置中启用 align: 'center'：
{ field: 'status', title: '状态', align: 'center', width: 100 }
第二步：若该列用了 templet，模板返回的 HTML 必须自行包裹居中容器：
{ field: 'action', title: '操作', templet: '
' }第三步：若整张表都要居中，给 table 外层容器加 class，再写高权重 CSS：
.layer-table-wrap .layui-table td, .layer-table-wrap .layui-table th { text-align: center !important; }
