正确做法是将分页栏DOM移出表格容器并挂载到body下，设position:fixed;bottom:0，同时为.layui-table-box添加等高底边距；禁用内置分页改用laypage.render可增强控制力，但需注意移动端软键盘导致的布局异常。
直接用 .layui-table-page 做 position: fixed 会错位
表格自带的分页栏 DOM 永远插在 .layui-table-box 底部，如果只给 .layui-table-page 加 position: fixed; bottom: 0，它会脱离表格容器流，导致两个问题：
一是滚动表格时分页栏不动，但表格内容还在动，视觉割裂；
二是当表格高度不足一屏时，分页栏会压在表格内容上，因为它的定位基准是视口而非表格。
正确做法：固定分页栏需配合 .layui-table-box 的底边距预留
让分页栏“看起来”固定在浏览器底部，实际是把它从表格 DOM 中逻辑分离，再用 CSS 模拟固定效果。关键不是强行定位分页栏，而是确保它始终处于可视区域最下方且不遮挡内容：
- 在
table.render()的done回调里执行：$('.layui-table-page').detach().appendTo('body')，把分页栏 DOM 移出表格容器，挂到下 - 加样式：
.layui-table-page { position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; background: #fff; border-top: 1px solid #eee; } - 必须同步给
.layui-table-box加底边距：.layui-table-box { margin-bottom: 42px; }（42px 是分页栏渲染后实际高度，含边框） - 如果页面有 footer 或其他底部元素，要额外增加
z-index并检查层叠顺序，避免被遮盖
page: false + laypage.render 更可控，但非必须
如果你需要更强控制力（比如分页栏响应式隐藏、或与其他组件联动），可以彻底禁用表格内置分页：
- 配置
page: false，关闭.layui-table-page渲染 - 手动调用
laypage.render({ elem: '#your-page-container', … })把分页渲染到指定容器（如<div id="page-bottom"></div>） - 把这个容器用
position: fixed; bottom: 0定位，并设width: 100%和合适的padding - 注意：此时必须在
jump回调里调用table.reload()，且后端接口要返回count字段，否则页码计算会错
移动端和小屏下容易忽略的兼容点
固定在浏览器底部的分页栏，在 iOS Safari 或安卓软键盘弹出时大概率会被顶起或遮挡——这不是 CSS 问题，而是浏览器 UI 行为：
- 不要依赖
vh单位做高度计算，它在软键盘弹出时会失真 - 避免给
.layui-table-page设height: 100vh或类似全屏拉伸 - 若业务强要求输入后仍可见分页栏，得监听
focusin/focusout事件，临时把分页栏transform: translateY(-Xpx)上移，避开键盘区域 - 测试时务必真机操作，模拟器常无法复现软键盘触发的布局重排
