需在 layui.use('layer', ...) 内、首次 layer.open 前调用 layer.config({ skin: 'my-default-skin' })，并确保 CSS 类名合法且全局可访问，否则弹窗不会自动应用该皮肤。

想让页面里所有 layer 弹窗一打开就自动带上你写的自定义皮肤类名，不用每个 layer.open 都手动写一遍 skin 参数——这需要在全局配置阶段就明确指定默认 skin，并确保它被 layer 正确识别和应用。

用 layer.config 设置全局默认 skin

第一步：在 layui.use('layer', ...) 内部、任意 layer.open 调用之前，执行 layer.config。

第二步：传入 { skin: 'my-default-skin' }，其中 my-default-skin 是你定义的合法 CSS 类名（仅小写字母、数字、短横线）。

第三步：必须确保该 config 调用发生在页面初始化早期，比如 DOMContentLoaded 之后、首次弹窗触发之前；【如果 config 放在某个按钮点击事件内部，那之前已打开的弹窗不会受此影响】。

配套 CSS 必须写在全局可访问位置

方法一：直接写在页面

中的

深蓝色网站后台管理系统layui框架模板-AdminPro

一款深蓝色网站后台管理系统layui框架模板

下载

方法二：通过 extend 加载外部 CSS 文件，例如 layer.config({ extend: 'css/my-skin.css', skin: 'my-default-skin' })；此时 my-skin.css 文件中所有规则都需以 .my-default-skin 开头，如 .my-default-skin .layui-layer-title { background: #2d8cf0; }。

注意：CSS 文件路径必须相对于当前 HTML 页面可访问，且文件加载成功后才会生效；浏览器控制台 Network 标签页可确认 my-skin.css 是否 200 加载。

验证是否生效

① 打开任意一个未显式传 skin 的 layer.open 弹窗（比如 layer.msg('测试') 或 layer.alert('确认？')）。

② 打开浏览器开发者工具 → Elements 面板 → 找到最外层弹窗容器（

）→ 检查是否存在 my-default-skin 这个 class。

③ 如果没有，说明 layer.config 未执行、执行晚于首次弹窗、或 skin 值拼写错误（大小写/空格/中文字符均非法）。