h5 不支持 uni.setnavigationbarcolor，需用 env(safe-area-inset-top) 预留顶部安全区；微信双标题栏应全局隐藏 uni-page-head；android 状态栏高度需动态获取，不可依赖静态值或 css 变量。
uni.setNavigationBarColor 在 H5 调用就报错
因为 uni.setNavigationBarColor 是 App 和小程序平台专属 API，H5 端压根没实现。控制台报 undefined is not a function 不是环境判断失误，是设计如此。别在 H5 的 onLoad 或 onShow 里写它，也别加条件编译兜底——写了不仅无效，还可能干扰页面渲染流程。
H5 页面顶部内容被“顶上去”了
这不是状态栏颜色重叠，而是没预留安全区。iOS Safari 默认启用 viewport-fit=cover，但你的 CSS 没响应 env(safe-area-inset-top)，导致标题直接贴着屏幕最上方显示：
- 确保
<meta name="viewport">包含viewport-fit=cover（uni-app 默认已加） - 给最外层容器加
padding-top: env(safe-area-inset-top)，不要写死20px或44px - 若用了自定义导航栏，它的高度应为
calc(44px + env(safe-area-inset-top))，不能只靠top: 0+fixed - 禁用纯
position: fixed; top: 0的伪导航栏，它会无视安全区，必须配合env(safe-area-inset-top)动态偏移
微信浏览器里出现两个标题栏
微信 X5 内核有时会无视 uni-page-head 的 display: none，同时自身又渲染一个原生标题栏，造成双头现象：
- 全局隐藏方案：在
main.js加混入，检测到微信环境后调用this.$nextTick(() => { document.querySelector('uni-page-head')?.style.display = 'none' }) - 更稳妥的做法是直接在
index.html的中注入样式：uni-page-head { display: none !important; } - 避免在页面级组件中反复判断 UA，统一在入口处理；否则多页跳转时容易漏掉
Android 设备状态栏高度不准
uni.getSystemInfoSync().statusBarHeight 在 Android 上返回值极不可靠：横竖屏切换、分屏模式、厂商定制系统都可能导致缓存失效或返回 0：
- 真机调试时优先用原生桥接方式获取：
plus.android.importClass('android.view.WindowInsets').getStableInsetTop() - 不要依赖
--status-bar-heightCSS 变量做 Android 布局，它只在 App 和小程序生效，H5 下为空 - 若必须用 JS 控制，应在
onReady后再调一次plus.navigator.getStatusBarHeight()，并监听resize事件做更新 - 小米、华为等机型开启「全屏显示」或「刘海透明化」后，
statusBarHeight可能突变，需用setTimeout延迟读取以避开初始化抖动
