分页按钮出现蓝色虚线框是因为layui未重置标签的浏览器默认outline样式；应通过.layui-laypage a { outline: none !important; }精准覆盖，但需兼顾可访问性，推荐用box-shadow替代或使用:focus-visible策略。
默认点击分页按钮时出现的蓝色虚线框（outline）是浏览器对可聚焦元素的默认焦点样式，Layui 未主动重置它，所以会原样保留。
为什么分页按钮有虚线框
所有 <a></a> 标签在获得焦点时（比如鼠标点击、Tab 键切换）都会触发浏览器默认的 outline 样式。Layui 的分页按钮生成的是 <a></a> 元素，且未设置 outline: none 或其他覆盖规则。
直接覆盖 .layui-laypage a 的 outline
最稳妥的做法是在你自己的 CSS 中精准重置，确保加载顺序在 layui.all.js 或 layui.css 之后：
.layui-laypage a {
outline: none !important;
}
- 必须加
!important：因为 Layui 内联样式或高权重选择器可能干扰 - 不要只写
:focus：部分浏览器（如 Safari）会在点击后短暂保留 focus 状态，仅写:focus无法完全消除“点击即现”的虚线 - 避免用
* { outline: none }：全局重置会影响表单、链接等其他可访问性关键元素
要不要保留可访问性焦点样式
去掉 outline 会降低键盘用户的操作可见性。如果项目需满足 WCAG 或内部无障碍规范，建议改用更友好的替代方案：
- 用
box-shadow模拟焦点态，例如：box-shadow: 0 0 0 2px rgba(0,150,136,.3) - 仅在非键盘操作时隐藏 outline：
.layui-laypage a:focus:not(:focus-visible) { outline: none; } - 测试方式：用 Tab 键导航到分页按钮，确认是否仍有清晰视觉反馈
真正要解决的不是“怎么删”，而是“删了之后用户还能不能顺利操作”。虚线框消失容易，但焦点不可见的问题常被上线后才发现。
