uni-app吸底按钮必须用position: fixed + bottom: 0实现，不可依赖flex或margin；需显式设置left: 0; right: 0;，并针对APP、微信小程序、H5分别适配安全区。
uni-app吸底按钮必须用position: fixed + bottom: 0
吸底按钮（即滚动时始终贴在屏幕底部的按钮）不能靠flex: 1或margin-top: auto实现，那些只让按钮“沉到内容末尾”，不是真正“吸底”。真正在全面屏上不被遮挡、不跳动、不闪烁的吸底，必须走 CSS 固定定位路线。
关键点：固定定位本身不解决安全区问题，但它是吸底行为的唯一可靠基底。后续所有适配都是在这个基础上加 padding 或 inset 补偿。
-
position: fixed要写在最外层容器或按钮自身上，避免父级transform、overflow: hidden等导致定位失效 - 必须显式设置
left: 0; right: 0;，否则在横屏或某些安卓全面屏上可能错位 - 别用
bottom: env(safe-area-inset-bottom)单独控制——它在 H5 和旧版微信小程序里直接失效，会把按钮“悬空”在半空
APP端优先用manifest.json配置safearea.background
iOS App 端（含 iPhone 14/15）的安全区背景色和偏移逻辑由原生层接管，JS 层无法覆盖。这时候改 CSS 或 JS 计算全是白忙——系统默认填白，你再怎么 padding 都盖不住那条白边。
正确做法是直接在manifest.json里声明：
"app-plus": {
"safearea": {
"background": "#1A1A1A",
"bottom": { "offset": "auto" }
}
}
这个配置生效有两个硬条件：
- 改完必须重新运行
npm run dev（或 HBuilderX 点「运行」→「重新运行」），热更新不触发 manifest 生效 - 如果用了自定义调试基座，需重启基座；真机调试时要删掉旧 App 再重装
-
background值必须和你的页面主背景色严格一致，哪怕差一个灰度（比如#1A1A1Avs#1B1B1B）都会露出接缝
微信小程序和 H5 必须手动读safeAreaInsets fallback
微信小程序基础库 ≥2.10.4 才返回safeAreaInsets.bottom，且必须在onShow或onReady后调用uni.getSystemInfo，onLoad里基本拿不到。
H5 完全不支持该字段，只能靠屏幕宽高比估算是否为全面屏：
- 用
window.screen.height / window.screen.width > 1.8粗筛（iPhone 14 Pro Max 是 1.91） - 但 OPPO/vivo 等安卓全面屏可能不满足该比值，得结合
window.innerHeight 判断是否存在隐藏导航栏 - 最终 fallback 值建议设为
34px（iOS 标准 Home Indicator 高度）或0，别写死20px或40px
样式层推荐混合写法：
.fixed-btn {
padding-bottom: env(safe-area-inset-bottom);
padding-bottom: calc(var(--safe-bottom, 0px) + 0px);
}
其中--safe-bottom由 JS 动态注入到:root，确保降级链完整。
按钮被底部指示条遮挡？检查z-index和box-shadow
即使位置和 padding 都对了，按钮仍可能被 iOS 底部指示条“压住”——这不是布局问题，而是层级和渲染顺序问题。
iOS 的 Home Indicator 是系统级 UI，z 轴高于所有 WebView 内容。所以按钮必须有足够高的z-index（建议 ≥999），且不能依赖opacity或backdrop-filter这类模糊属性，它们会让按钮在指示条前“变薄”甚至半透明。
- 加一层
box-shadow: 0 -2px 10px rgba(0,0,0,0.1)能视觉强化按钮存在感，抵消被“压扁”的错觉 - 避免用
border-bottom模拟分隔线，它会被指示条截断；改用linear-gradient画在伪元素上更稳 - 真机测试时务必开启「引导式访问」或「辅助触控」，确认按钮点击区域是否被系统手势拦截
安全区不是像素值问题，是系统与应用之间的一道隐性契约。你填的每一分 padding，都得对应一次平台能力确认、一次 fallback 设计、一次真机手势验证——漏掉任意一环，用户手指落下的地方，就可能是系统和你代码打架的战场。
