要修改layer弹窗标题栏为红色背景、白色文字，需在layui.css之后通过CSS覆盖.layui-layer-title类，添加!important声明确保生效：.layui-layer-title { background-color: #f44336 !important; color: #fff !important; font-weight: 600 !important; padding-left: 20px !important;}
修改layer弹窗标题的背景色与文字颜色
需要让layer弹窗顶部标题栏显示为红色背景、白色文字，且不影响其他弹窗样式，不能靠改title参数或JS动态注入HTML实现，必须通过CSS精准覆盖。
直接覆盖.layui-layer-title类（推荐）
这是最稳定、兼容性最好、无需改动JS调用的方式，适用于所有layer.open、layer.alert、layer.confirm等类型弹窗。
第一步：在页面<head>内或全局样式文件中插入以下CSS代码：
<style>
.layui-layer-title {
background-color: #f44336 !important;
color: #fff !important;
font-weight: 600 !important;
padding-left: 20px !important;
}
</style>
第二步：确保该样式加载在layui.css之后——如果放在<head>末尾，或用<link rel="stylesheet">引入在layui.css下方，即可生效。
注意：【不加!important会失效】，因为layer内部使用内联样式设置color和background-color，优先级高于普通CSS规则。
第三步：刷新页面，任意layer.open()弹出的窗口标题都会立即呈现红底白字效果。
仅修改某类弹窗（如只改alert）
当只想让layer.alert的标题变色，而保留layer.msg、layer.confirm原样时，需利用layer内置的skin类前缀做限定。
方法一：用layer.alert自带skin前缀
layer.alert默认添加skin类名layui-layer-alert，因此只需限定选择器范围：
body .layui-layer-alert .layui-layer-title {
background-color: #ff9800 !important;
color: #212121 !important;
}
方法二：自定义skin并显式指定
调用时传入skin: 'my-alert'：
layer.alert('操作成功', { skin: 'my-alert' });
对应CSS写为：
body .my-alert .layui-layer-title {
background-color: #4caf50 !important;
color: white !important;
}
这一步操作起来很简单，直接把上面两段代码复制进项目就行，不用动任何JS逻辑。
用title数组+skin强行注入HTML（慎用）
此法能实现图标+文字混排，但极易因遗漏skin配置导致title被转义成纯文本，属于高风险方案，仅在必须嵌入图标时考虑。
方法一：title传数组 + skin显式声明
必须同时满足两个条件：title是数组，且skin参数存在（哪怕值为空）：
layer.open({
title: ["? 系统通知", ""],
skin: "custom-title", // 即使为空字符串也必须传
content: "欢迎使用系统"
});
然后补上CSS：
body .custom-title .layui-layer-title {
background-color: #2196f3 !important;
color: #fff !important;
}
方法二：不传skin → title内容原样显示为字符串，标签不会解析。
【漏掉skin参数会导致标题变成纯文本“<i class='layui-icon'>?</i> 系统通知”】
