Bootstrap 5分页需严格遵循HTML结构：用包裹，页码项为，当前页同时加active和disabled；PHP须过滤$_GET['page']并用http_build_query保留参数，手动实现省略号逻辑，pagination-sm仅在≥576px生效。
分页HTML结构必须匹配Bootstrap 5的
Bootstrap 5不再支持pagination-sm或pagination-lg直接加在<nav></nav>上，必须用<ul class="pagination pagination-sm"></ul>。PHP生成的分页HTML如果还沿用Bootstrap 4写法（比如把active加在<li>里但没包<a></a>），会丢失点击态和圆角样式。
正确结构要点：
-
<nav aria-label="Page navigation"></nav>包裹整个分页区域 - 每个页码项是
<li class="page-item"><a class="page-link" href="?page=2">2</a></li>，不能省略<a></a> - 当前页要同时加
disabled（对<a></a>）和active（对<li>），否则CSS伪类:hover和焦点样式异常 - 上一页/下一页按钮需用
<li class="page-item"><a class="page-link" aria-label="Previous"><span aria-hidden="true">«</span></a></li>，否则屏幕阅读器无法识别
PHP生成分页HTML时，$_GET['page']必须过滤并转为整型
直接拼接$_GET['page']进href会导致XSS风险，且非数字值（如page=abc）会让intval()返回0，造成第0页链接——Bootstrap不会报错，但后端通常没定义该页，返回404或空内容。
安全做法：
立即学习“PHP免费学习笔记（深入）”；
- 用
$current_page = max(1, intval($_GET['page'] ?? 1));确保最小为1 - 生成链接时统一用
http_build_query(array_merge($_GET, ['page' => $i]))保留其他查询参数（如搜索关键词） - 不要用
htmlspecialchars()包裹整个href值，它会转义&成&，破坏URL解析
Bootstrap分页组件不自动处理“省略号”，得PHP手动判断边界
Bootstrap只提供CSS样式，不控制哪些页码显示、哪些缩为<li class="page-item disabled"><span class="page-link">…</span></li>。如果总页数100，全输出100个<li>，页面卡顿且不可读。
推荐逻辑（以当前页$current_page=5、最多显示5个页码为例）：
- 始终显示第1页和最后1页
- 当前页左右各留2个（即显示
3,4,5,6,7），超出范围则插入… - 用
range()生成核心页码数组，再用array_unique()去重并sort() - 遍历页码数组时，遇到间隔＞1就补
<li class="page-item disabled"><span class="page-link">…</span></li>
响应式断点影响pagination-sm实际生效条件
Bootstrap 5的.pagination-sm只在min-width: 576px（sm断点）及以上生效，小屏设备仍按默认尺寸渲染。如果想手机也变小，要么覆盖CSS：@media (max-width: 575.98px) {.pagination .page-link { padding: 0.25rem 0.5rem; font-size: 0.75rem; } }，要么改用pagination-lg配合媒体查询反向控制。
更稳妥的做法是：在PHP中检测$_SERVER['HTTP_USER_AGENT']含Mobile就输出pagination-sm类——但注意，这属于UA嗅探，有误判风险；生产环境建议纯CSS方案。
分页的“省略逻辑”和“响应式尺寸”这两处最容易被当成纯样式问题忽略，结果在真机测试时才发现页码堆叠或点击热区太小。
