Layui 2.8+ 不支持直接修改 CSS 变量换肤，必须使用官方主题构建工具生成完整主题文件（如 layui-theme-red.css）并配合 layer.config 加载，或对局部按钮用高优先级选择器 + !important 强制覆盖样式。
直接改 layui.css 里的颜色变量没用
因为 layui 2.8+ 虽然在源码 sass 中用了 --layui-color-primary 这类 css 变量，但构建时已静态编译——最终生成的 layui.css 里根本找不到这些变量，全被替换成固定色值（比如 #009688）。你手动搜索替换 #009688 到新颜色，会漏掉大量衍生色（hover、disabled、边框、阴影、渐变起点等），导致按钮状态错乱或样式断裂。
换肤必须用整套主题 CSS 文件
官方唯一支持的方式是：用 Layui 主题构建工具（或下载预编译包）生成完整的新主题文件，例如 layui-theme-red.css，然后通过 layer.config({ extend: 'path/to/layui-theme-red.css' }) 加载，并在 layer.open 中指定 skin: 'layui-ext-red' 启用。注意：
- 不能只改一个按钮类（如
.layui-btn）的 background，Layui 的按钮样式链很长：.layui-btn:hover、.layui-btn[disabled]、.layui-btn-primary、.layui-btn-warm等都依赖主色自动推导 - 所有主题 CSS 必须和默认
layui.css同时引入，仅通过disabled属性切换启用状态，避免样式冲突 - 切换后建议调用
layer.closeAll()清理旧弹层，否则 DOM 上残留的旧 skin 类名可能让按钮颜色不一致
临时覆盖单个按钮颜色只能靠 CSS 强制注入
如果只是局部调整（比如某个 layer.confirm 的确认按钮），别动主题，用精准选择器 + !important 更快：
.layui-layer-btn .layui-layer-btn0 {
background-color: #ff6b6b !important;
border-color: #ff5252 !important;
color: #fff !important;
}
.layui-layer-btn .layui-layer-btn0:hover {
background-color: #ff5252 !important;
border-color: #ff3a3a !important;
}
关键点：
- 必须用
.layui-layer-btn .layui-layer-btn0这种带父级限定的选择器，避免影响全局其他按钮 - 一定要重写
:hover和[disabled]状态，否则交互时颜色跳变 - 如果按钮在弹层打开后才动态渲染（比如异步内容），得在
success回调里用 jQuery 手动加样式：$(layero).find('.layui-layer-btn0').css({...})
渐变按钮要绕过 Layui 的内联 style 覆盖
Layui 某些版本会在按钮上加 style="background-color: ..." 内联样式，直接干掉你的 CSS 声明。想实现 background: linear-gradient()，必须：
- 用
!important或更高优先级选择器（如body .layui-layer-btn0） - 同时设置
background-image和background-color，且后者设为transparent或与渐变协调 - 显式写
transition: background 0.2s ease，否则 hover 动画会卡顿或失效 - 渐变角度用
135deg而非to right，兼容 IE10+/Android 4.4+；颜色用rgba(255,107,107,0.9)带 alpha，别依赖 opacity
