汉堡菜单点不中主因是热区不达标：必须在.navbar-toggler上同时设置display: inline-block、box-sizing: border-box、min-width: 44px、min-height: 44px和touch-action: manipulation，缺一不可，且需通过Computed面板验证最终值。
移动端汉堡菜单点不中，不是JS没绑，是热区不达标
真机上点汉堡图标没反应，90%不是 JavaScript 失效，而是 iOS Safari 和主流 Android WebView 对可点击区域有硬性要求：必须同时满足 min-width: 44px、min-height: 44px、touch-action: manipulation，且这三条必须作用在按钮自身（.navbar-toggler 元素上），缺一不可。
为什么加了 padding 还是点不中
常见错误是只靠 padding 撑开尺寸，却忽略了三个前提条件：
-
display是inline（默认值），导致padding和min-height在内联元素上不生效 -
box-sizing是content-box，padding + border推出容器边界，若父容器有overflow: hidden，热区直接被裁掉 - 父容器（如轮播图、弹层、抽屉）设置了
touch-action: none，子元素的manipulation被强制覆盖失效
正确写法：四条 CSS 必须同时存在
直接加到你的自定义 CSS 文件末尾（确保优先级足够）：
.navbar-toggler {
display: inline-block !important;
box-sizing: border-box !important;
min-width: 44px !important;
min-height: 44px !important;
touch-action: manipulation !important;
}
注意：!important 是为了覆盖 Bootstrap 默认样式中可能存在的冲突；display: inline-block 是关键前提，否则 min-height 不起作用。
立即学习“前端免费学习笔记（深入）”；
验证是否生效的最快方式
用 Safari 或 Chrome 真机远程调试，选中汉堡按钮，在「Computed」面板里直接看这四项的最终计算值：
-
min-width和min-height是否都 ≥ 44px -
touch-action是否为manipulation -
box-sizing是否为border-box
别查源 CSS 文件——那些只是声明，Computed 才是浏览器实际执行的结果。漏掉任意一项，点按就大概率失败。
