layui弹窗文字过长被截断或挤占关闭按钮时，应通过css覆盖.layui-layer-content样式设white-space:normal和word-break:break-word并加!important；也可用templet自定义内容实现精准控制；小屏下需在layer.ready中动态检测溢出并限制max-width。
layui弹窗中提示文字过长时被截断成“…”或挤占关闭按钮，导致用户无法阅读完整信息也无法关闭弹窗，必须让文字在限定宽度内自动折行并保持布局稳定。
用CSS覆盖layer内置样式（推荐）
这一步操作起来很简单，直接在页面全局样式或弹窗触发前的
【必须加 !important，否则 layer 内联样式会覆盖】
.layui-layer-content { white-space: normal !important; word-break: break-word !important; padding: 15px 20px !important; }
注意：不要写 .layui-layer-body 或 .layui-layer-content p —— layer 有时直接把文字塞进 .layui-layer-content，不包任何标签；只作用于该类才能兜底生效。
用templet自定义内容区域（精准控制）
适用于需要保留HTML结构、插入图标或按钮的场景。layer.open 的 content 参数不能直接传字符串，要改用 templet 选项：
方法一：传函数返回带样式的div
layer.open({
type: 1,
content: function() {
return '
}
});
方法二：传DOM节点（适合复用）
先在HTML里写好模板：
<script type="text/html" id="tip-tpl"><br> <div style="white-space:normal; word-break:break-word; padding:15px 20px; line-height:1.6;">{{d.msg}}<br></script>
再调用：
layer.open({
type: 1,
content: $('#tip-tpl').html().replace('{{d.msg}}', '超长提示文字内容'),
});
适配小屏设备的动态处理
第一步：监听窗口 resize 并检测当前弹窗是否已打开
第二步：获取 .layui-layer-content 元素，判断其 scrollWidth 是否大于 clientWidth
第三步：若溢出，则强制设置 max-width 为屏幕宽度的 90%，并重设 white-space 和 word-break
layer.ready(function(){
var $content = $('.layui-layer-content');
if ($content.length && $content[0].scrollWidth > $content[0].clientWidth) {
$content.css({
'max-width': Math.min(window.innerWidth * 0.9, 480) + 'px',
'white-space': 'normal',
'word-break': 'break-word'
});
}
});
这一步关键在 layer.ready 而非 $(document).ready —— 弹窗DOM尚未渲染完成时查不到 .layui-layer-content。
