直接改--bs-pagination-bg无效，因Bootstrap 5中.page-link背景色硬编码为var(--bs-white)，未引用该变量；真正控制选中态的是.page-item.active .page-link，须显式覆盖background-color、border-color、color及box-shadow，并同步处理:hover、:focus、.disabled等状态。
直接改 --bs-pagination-bg 为什么没效果
因为 Bootstrap 5 的 .page-link 背景色是硬编码的 var(--bs-white)，压根没引用 --bs-pagination-bg 这个变量。你在 :root 里改它，对页码按钮完全无效。真正控制高亮色的是 .page-item.active .page-link 这个选择器——漏掉它，当前页永远是默认白底灰边。
.page-item.active .page-link 必须显式覆盖的四个属性
只写 background-color 不够，边框、文字、焦点态不一致会导致视觉断裂：
-
background-color：当前页背景（比如#0d47a1） -
border-color：必须同步改，否则边框还是 Bootstrap 默认灰 -
color：文字色常被忽略，尤其深色背景配浅色字 -
box-shadow（替代outline）：点击后聚焦残留环，建议用box-shadow: 0 0 0 0.2rem rgba(13, 71, 161, 0.25)
别忘了禁用态和悬停态，否则首/末页颜色错乱
分页首/末页常为 .disabled，若不单独处理，在深色主题下几乎不可读：
-
.my-pagination .page-item.disabled .page-link：必须独立声明，不能复用默认值 -
.my-pagination .page-link:hover：悬停色要和 active 色有层次，比如比 active 浅一级 - 所有规则都应以自定义容器开头（如
.my-pagination），避免污染全局.page-link或第三方组件（如bootstrap-table内置分页）
Bootstrap 4 和 5 的关键区别点
如果你用的是 Bootstrap 4，注意它的选择器权重更高：
- 默认用
a.page-link或.pagination > .page-item > .page-link，单写.page-link会被覆盖 - 必须覆盖全部五种状态：
.pagination .page-link、:hover、:focus、.page-item.active .page-link、.page-item.disabled .page-link - Bootstrap 5 可用 CSS 变量（如
--bs-pagination-active-bg），但仅在 Sass 编译时生效，最终输出仍是固定值，运行时不响应
最易被忽略的是禁用态样式和容器隔离——不加 .my-pagination 包裹，改完发现后台表格分页也变了色；不处理 .disabled，首页按钮在移动端点不动还看不清。
