Bootstrap分页组件在移动端不会自动缩放，点不准主因是触摸热区不足44×44px；需手动设置min-width/min-height、修复事件拦截、同步disabled与aria-disabled状态。
Bootstrap 分页组件不会在移动端自动缩放大小——它压根没有这个逻辑，所谓“自动缩放”全是错觉或外部干扰。
为什么加了 .pagination-lg 在手机上还是点不准
根本不是尺寸没变大，而是触摸热区（clickable area）太小。Bootstrap 的 .pagination-lg 只调 font-size、padding、line-height 和 border-radius，但不保证 min-width 和 min-height ≥ 44px。iOS/Android 推荐最小触摸目标是 44×44px，而 .pagination-lg 默认 padding 是 0.75rem 1.5rem（约 12×24px），远不够。
- 用 Chrome DevTools 选中
.page-link，在「Computed」里看实际min-width和min-height，别信 CSS 文件里写的 - 检查父容器是否设了
pointer-events: none或touch-action: none（常见于轮播遮罩、弹窗背景） - 确认
html { font-size }没被媒体查询意外压缩（比如全局设成12px，那1.25rem就只剩 15px）
怎么让分页按钮在手机上“真正变大可点”
别依赖 .pagination-lg 单独生效，得补足移动端关键约束：
- 给
.page-link加硬性限制：min-width: 44px和min-height: 44px - 用媒体查询只在小屏生效：
@media (max-width: 768px) { .page-link { padding: 0.75rem 1rem; border-radius: 4px; line-height: 1.6; } } -
line-height必须同步调高，否则文字垂直居中失效，看起来像悬空 - 避免用
transform: scale()或zoom，会破坏点击坐标和辅助技术识别
动态禁用分页项时，disabled 和 aria-disabled 必须一起改
只写 disabled 属性，JS 动态切换后，VoiceOver/TalkBack 仍会读作“可点击”。视觉灰了，但读屏软件不知道你禁用了。
- 启用时：
el.removeAttribute('disabled')+el.removeAttribute('aria-disabled') - 禁用时：
el.setAttribute('disabled', 'true')+el.setAttribute('aria-disabled', 'true') - 绝对不要用
opacity: .5替代禁用状态——对读屏软件完全不可见
真正起作用的从来不是“自动缩放”，而是明确控制热区尺寸、切断事件拦截、同步可访问性状态——这三件事漏掉任何一个，手机上就点不准。事情说清了就结束。
