移动端按钮点不中是因未满足44px×44px触控规范：必须同时设display:inline-block、box-sizing:border-box、min-width:44px、min-height:44px、touch-action:manipulation，且后两者须作用于按钮自身，缺一不可。
移动端按钮点不中，不是 JS 绑定失效，也不是样式没加载，而是 iOS Safari 和主流 Android WebView 对可点击区域有硬性门槛：必须满足 min-width 和 min-height 均 ≥ 44px，且 touch-action: manipulation 必须作用在按钮自身上——漏掉任意一条，真机上就大概率失灵。
为什么加了 padding 还是点不中
常见错误是只改 padding 却忽略三个前提：
-
display是inline（默认值），导致padding和min-height不生效 -
box-sizing是content-box，padding+border推出父容器，被overflow: hidden裁掉热区 - 父容器（比如轮播图、弹层、抽屉）设置了
touch-action: none，子元素的manipulation直接被覆盖
用 Chrome 或 Safari 真机调试时，选中按钮，在「Computed」面板里直接看 min-width、min-height、touch-action 和 box-sizing 的最终值，比查 CSS 文件更准。
.btn 类必须补全这 5 个关键声明
Bootstrap 默认没设 min-width/min-height，也没统一 box-sizing，所以得手动加固。推荐写法：
button.btn,
input[type="submit"].btn,
input[type="reset"].btn,
a.btn {
display: inline-block;
box-sizing: border-box;
min-width: 44px;
min-height: 44px;
touch-action: manipulation;
}
注意：min-width/min-height 不能用媒体查询缩小——44px 是触控规范下限，缩字体可以，缩热区不行；touch-action: manipulation 必须写在按钮上，写在 .btn-group 或 form 上无效。
哪些地方容易漏掉导致白配
真机测试时如果蓝色高亮框没包住整个 padding 区域，大概率是以下某处断链了：
-
touch-action: manipulation加在父 div 上，而不是button或a.btn自身 - 按钮嵌在
transform: scale(0.8)的容器里，但没同步放大min-width/min-height（应设为55px） - 用了
user-select: none却没加-webkit-tap-highlight-color: transparent，某些安卓 WebView 下会抑制点击 - 按钮含
svg或img子元素，而子元素写了touch-action: none，阻止事件冒泡
分页、下拉、自定义容器要单独处理
Bootstrap 的 .page-link、bootstrap-select 的触发按钮、或手写的 <div class="btn"> 都不是原生可点击语义元素，浏览器不会自动优化：
<ul>
<li>
<code>.page-link 必须额外加 min-width: 44px 和 min-height: 44px，pagination-sm 的 padding 只有 ~6×12px，远不够
bootstrap-select 若未启用 data-mobile="true"，其 JS 渲染的下拉按钮热区常被低估，需手动给 .bs-searchbox button 补上述规则<div role="button"> 必须同时加 <code>tabindex="0" 和 touch-action: manipulation，否则 iOS Safari 可能拒绝加速
最易被忽略的是：所有这些规则都必须在真机上验证，模拟器里的「Toggle device toolbar」无法准确反映 touch-action 和热区坐标的实际行为。
