应直接修改 css 类（如 .layui-laypage a、.layui-laypage-curr）并加 !important 覆盖内联样式，而非配置 table.render() 的 page 选项或 laypage.render() 的 theme 参数；因 layui 渲染时写入内联 style，不加 !important 则样式被划掉失效。
layui分页按钮背景色怎么改？直接覆盖 CSS 类
Layui 分页的背景色不能通过 table.render() 的 page 配置项控制，也不支持 laypage.render() 的 theme 参数设颜色——它只影响文字色和边框粗细，不接管背景。真正起作用的是 CSS 类：.layui-laypage a（所有页码按钮）、.layui-laypage-curr（当前页容器）、.layui-laypage-prev 和 .layui-laypage-next（上/下一页）。
必须加 !important，否则会被 Layui 渲染时写的内联 style 覆盖（比如 style="background-color: #009688;"）。实测不加就无效，在 DevTools 里能看到样式被划掉。
-
.layui-laypage a：改所有可点击页码、上/下一页的默认背景和文字色 -
.layui-laypage-curr：当前页按钮，重点改这里；注意它内部还有个.layui-laypage-em，是那个小圆角高亮底色，也要单独覆盖 -
.layui-laypage .layui-laypage-spr：省略号（…），默认透明，如需着色也得单独写
示例：
.layui-laypage a {
background-color: #1FB1EA !important;
color: #fff !important;
border: 1px solid #1FB1EA !important;
}
.layui-laypage-curr {
background-color: #007AFF !important;
color: #fff !important;
}
.layui-laypage-curr .layui-laypage-em {
background-color: #007AFF !important;
}
为什么改了没生效？几个典型坑
不是代码写错，大概率是加载顺序或选择器权重问题。
- 你的自定义 CSS 必须在
layui.all.js加载完成之后再注入，否则 Layui 自带样式后加载，会覆盖你的规则 - 如果表格是动态渲染（比如 iframe 内、异步 tab 页中），分页可能被多次重绘，导致样式丢失——解决办法是在
table.render()的done回调里再执行一次样式注入 - 用了 Vue 单文件组件且启用了
scoped，CSS 不会穿透到 Layui 生成的 DOM，必须用:deep(.layui-laypage a)写法 - 查 selector 是否写对：Layui 2.8+ 默认把分页插入到
table后面的兄弟节点，不是嵌套在 table 内部，别误写成table .layui-laypage a
“共 x 条”文字能一起改背景吗？不能移动，但能调色
.layui-laypage em 是包裹“共 x 条”的唯一可选元素，但它只是纯文本容器，没有 class 或 id，也不能用 CSS 改位置（比如移到右边或隐藏）。
想让它消失？不行。想改颜色？可以：
.layui-laypage em {
color: #666 !important;
}
真要控制显示逻辑（比如只在总数 > 0 时显示），必须显式配置 layout 参数：layout: ['count', 'prev', 'page', 'next']，然后靠后端数据判断是否传 count 值——Layui 本身不提供 JS 层开关。
移动端按钮太小？加媒体查询微调
Layui 默认未做响应式适配，小屏下按钮文字挤在一起。别改全局 font-size，用媒体查询局部调整更安全：
@media (max-width: 768px) {
.layui-laypage a,
.layui-laypage-curr {
padding: 4px 8px !important;
font-size: 12px !important;
}
}
注意：padding 和 font-size 都要加 !important，否则同样被内联样式压制。另外，.layui-laypage-curr 的圆角在小屏下容易变尖，可额外加 border-radius: 4px !important 统一。
最常被忽略的一点：Layui 的分页样式是“一次性注入”，不是动态监听。你改完 CSS，但页面已渲染完成，旧分页 DOM 还在，新样式不会自动应用——必须触发一次 laypage.render() 重绘，或 reload 整个表格，才能看到效果。
