必须先添加基础类layui-btn，再组合颜色类（如layui-btn-primary）才生效；漏写layui-btn会导致按钮样式失效、颜色不显示。
layui表单提交按钮颜色怎么改？先确认 class 是否写对
直接加 layui-btn-primary 或 layui-btn-danger 但没带 layui-btn，颜色肯定不生效。Layui 的按钮样式是组合式设计：layui-btn 是基础类，所有颜色/尺寸类都必须和它一起用。
常见错误写法：<button class="layui-btn-primary">提交</button> → 灰色背景、无边框、文字发虚；正确写法：<button class="layui-btn layui-btn-primary">提交</button>。
-
layui-btn-normal（墨绿）在 v2.8+ 才支持，旧版本会回退为默认灰 -
layui-btn-warm（橙）从 v2.7+ 加入，低于该版本无效 - 想用蓝色（如
#2C9DD5），别硬覆盖原生类，建议新增自定义类：layui-btn-blue，并在 CSS 中写：.layui-btn-blue { background-color: #2C9DD5 !important; border-color: #2C9DD5 !important; }
为什么加了 class 还是蓝色/灰色？检查是否被其他 CSS 覆盖
有些项目全局重置了 button 样式（比如 * { box-sizing: border-box; } 或清除了 border、border-radius），会导致 Layui 按钮“发虚”、圆角消失、边框变粗。
排查方法：打开开发者工具，选中按钮，看 background-color、border、border-radius 是否被其他规则覆盖（尤其是 inline style 或高权重选择器）。
- 修复优先级顺序：用更具体的选择器，例如
body .layui-btn或form .layui-btn，比单纯.layui-btn更高 - 必要时加
!important，但仅限局部覆盖，避免污染全局 - 禁用可能冲突的 reset.css 或 normalize.css 片段（特别是针对
button的部分）
表单用了 lay-submit，按钮颜色还能自定义吗？能，但得绕开自动校验逻辑
lay-submit 触发的是内置校验流程，它生成的按钮 DOM 是静态的，但颜色修改不受影响——只要 class 正确，layui-btn 组合类依然起作用。真正卡住颜色修改的，往往是后续交互中 layer.tips 或弹层覆盖了视觉焦点，让人误以为“按钮没变色”。
- 如果按钮在弹层里（比如
layer.open()中的表单），需额外处理弹层按钮样式：用skin: 'my-skin'+ 自定义 CSS，例如body .my-skin .layui-layer-btn0 - 若提交后弹出 confirm 提示，其按钮颜色独立于表单按钮，要单独改
layer.confirm的 skin 或接管 HTML - 动态渲染的按钮（如 Ajax 后插入），确保
form.render()已执行，否则 Layui 不会识别新按钮并应用样式
自定义颜色时，为什么 hover 或 active 态不一致？伪类样式没写全
Layui 按钮的悬停和点击态依赖 :hover 和 :active 伪类，但很多自定义 CSS 只改了默认态，导致鼠标移上去颜色又变回原样。
完整示例（以蓝色为例）：
.layui-btn-blue {
background-color: #2C9DD5 !important;
border-color: #2C9DD5 !important;
}
.layui-btn-blue:hover {
background-color: #1a7bbd !important;
border-color: #1a7bbd !important;
}
.layui-btn-blue:active {
background-color: #166aa0 !important;
border-color: #166aa0 !important;
}
- 务必同步定义
:hover和:active，否则交互体验断裂 - 不要只靠
!important压样式，也要注意加载顺序：自定义 CSS 必须在layui.css之后引入 - 移动端点击反馈弱？可加
transition: all .1s提升响应感
实际改色这事本身几行 CSS 就能搞定，难的是定位到真正生效的那个 class、压住它的权重、并且让 hover/active/禁用态都保持一致。多数人卡在第一步：漏写了 layui-btn。
