最可靠方式是直接给<ul class="pagination">加justify-content-center类；text-center等无效因.pagination为flex容器，text-align不作用于弹性子项；窄屏需用justify-content-sm-center防挤压；动态分页须JS手动添加类或媒体查询CSS。
直接给 <ul class="pagination"> 加 justify-content-center 类，是最可靠、零配置的居中方式。 其他写法（比如 text-center、margin: 0 auto、center 标签）在 Bootstrap 4/5 中基本无效或不可靠，不是类没加对，就是布局机制不匹配。
为什么 text-center 加在 <ul> 上完全没用
因为 .pagination 默认是 display: flex 容器，子项（<li class="page-item">）是弹性项目。text-align: center 只影响内联内容的文本对齐，对 flex 子项的主轴位置毫无作用。浏览器根本不会拿它去计算 justify-content。
- 常见错误：给外层
<nav>或<div>加text-center，但该容器没设display: inline或被浮动干扰 - 更隐蔽的问题：自定义 CSS 覆盖了
.pagination { display: block }，导致 flex 布局彻底失效 - 拼写陷阱：
justify-center在 Bootstrap 5 中不存在，必须写全justify-content-center
justify-content-sm-center 才是移动端“看起来居中”的关键
直接用 justify-content-center 在 iPhone SE（375px）、iPhone 12 mini（390px）等窄屏上，常出现页码挤成一团、换行错位甚至横向溢出——不是类没生效，而是它在所有断点下都强制居中，而小屏根本塞不下全部按钮。
-
justify-content-sm-center从sm断点（≥576px）开始生效，在典型手机竖屏下保持左对齐，只在 iPad mini、折叠屏展开态等稍宽设备上才启用居中 - 类必须加在
<ul class="pagination">上，不能加在<nav>或外层容器 - 如果同时写了
justify-content-center和justify-content-sm-center，后者会覆盖前者，造成预期外的行为 - 搭配
pagination-sm也完全兼容，无需额外调整 padding 或 gap
和 bootstrap-table 动态分页共存时怎么加居中
bootstrap-table 的分页是 JS 运行时动态插入的 DOM，HTML 里写的 justify-content-sm-center 会被忽略。
- 推荐方案：监听
onPostBody事件后手动加类：$('ul.pagination').addClass('justify-content-sm-center') - 备选方案：写 CSS 规则，但要注意断点控制 ——
.bootstrap-table .pagination { justify-content: center; }必须用@media (min-width: 576px)包裹，否则又回到窄屏挤压问题 - 避免依赖
paginationVAlign: 'center'，旧版插件支持不一致，容易失效
真正卡住的往往不是“怎么加类”，而是某个隐藏的 display 覆盖、父容器的 float 或 position: absolute 干扰了 flex 布局，或者响应式断点没对齐实际设备宽度。动手前先打开开发者工具，检查 .pagination 的 computed display 是否为 flex，再看父容器有没有破坏 flex 流的样式。
