layui按钮颜色生效必须组合使用基础类layui-btn与颜色类，如layui-btn layui-btn-danger；单独使用layui-btn-danger无效。颜色类仅覆盖部分样式，依赖基础类提供默认结构和优先级。
直接改 class 就行，但必须按组合规则来，漏掉基础类 layui-btn 一切颜色和尺寸类都无效。
按钮颜色怎么设才生效
Layui 的颜色类（如 layui-btn-primary、layui-btn-danger）不是独立可用的，它们只负责覆盖部分样式，前提是先有 layui-btn 这个基础类。
- ✅ 正确写法：
<button class="layui-btn layui-btn-danger">删除</button> - ❌ 错误写法：
<button class="layui-btn-danger">删除</button>（没layui-btn，样式完全不加载） -
layui-btn-normal仅在 2.8+ 版本支持，旧版会回退到默认灰；layui-btn-warm是 2.7+ 加入的，低于此版本也不显示 - 想加自定义色（比如蓝色），别硬改源码，新建类更安全：
.layui-btn-blue { background-color: #1890ff !important; border-color: #1890ff !important; }，再配合layui-btn layui-btn-blue
按钮大小控制的三档规则
Layui 只提供明确的三档尺寸类：layui-btn-lg、layui-btn-sm、layui-btn-xs，没有 md 或响应式尺寸。
-
layui-btn-lg：高度约 42px，适合主操作（如“导出”），但表格里可能被行高截断 -
layui-btn（无后缀）：默认 36px，最常用 -
layui-btn-sm/layui-btn-xs：分别对应 30px 和 24px；注意layui-btn-xs在 IE10 下可能渲染异常 - 不能混用尺寸类，比如
layui-btn-lg layui-btn-sm，后者会被前者覆盖 - 在数据表格中若
layui-btn-lg不显大，大概率是表格行高限制了，需加 CSS：.layui-table tbody tr td { height: auto; padding: 5px 10px; }
为什么按钮颜色/圆角/文字看起来不对
常见原因是全局重置 CSS 干扰了 Layui 的默认 button 样式，比如 * { box-sizing: border-box; } 或强制设置了 button { border-radius: 0; color: #333; }。
- 现象包括：边框变粗、文字发灰、圆角消失、“按钮发虚”
- 排查方法：浏览器开发者工具选中按钮，看
color、border、border-radius是否被其他规则覆盖 - 修复建议优先用更高优先级选择器，比如
body .layui-btn；万不得已才加!important，例如：body .layui-btn { border-radius: 2px !important; } - 特别注意：某些 UI 框架（如 Normalize.css）会重置
button的font和line-height，导致文字上下偏移，需单独补vertical-align: middle
弹层里的按钮怎么单独改色
layer 弹层按钮（如 layer.confirm 的“确定”“取消”）无法通过参数直接改色，必须用皮肤机制或精准 CSS 覆盖。
- 推荐方式：用
skin: 'layui-ext-myskin'配合自定义 CSS 文件，在里面写：body .layui-ext-myskin .layui-layer-btn0（确认按钮）、.layui-layer-btn1（取消按钮） - 临时改单个弹层：用带父级限定的选择器 +
!important，例如：.layui-layer-btn .layui-layer-btn0 { background-color: #52c418 !important; } - 必须同时覆盖
:hover和[disabled]状态，否则鼠标悬停或禁用时颜色跳变 - 如果按钮是异步加载进来的（比如
content是 AJAX 返回），得在success回调里手动加样式：$(layero).find('.layui-layer-btn0').css({})
最容易被忽略的是：所有颜色/尺寸类都依赖 layui-btn 基础类；表格里按钮撑不开往往不是 class 写错了，而是被 .layui-table tbody tr td 的固定 height 卡住了。
