H5端--status-bar-height恒为0，因其无系统状态栏概念；导航栏高度应固定为44px，通过条件编译区分平台，避免依赖不可靠的H5运行时API。
--status-bar-height 在 H5 端就是无效的，值恒为 0。这不是 bug，是设计如此。H5 没有系统状态栏概念，强行用它会导致导航栏贴顶、内容被截断或布局错乱。
为什么 H5 里 --status-bar-height 总是 0
H5 运行在浏览器中，顶部由地址栏/工具栏控制，不是原生系统层；--status-bar-height 是 App 和小程序才注入的 CSS 变量，H5 编译时根本不会生成这个变量。很多项目直接抄小程序写法：top: var(--status-bar-height)，结果在 iOS Safari 下导航栏直接“飞”到屏幕最顶上。
- uni.getSystemInfoSync().statusBarHeight 在 H5 返回 0 或 NaN，不可信
- env(safe-area-inset-top) 在 H5 大部分浏览器不支持，返回 undefined 或 0
- 试图用 JS 动态计算“状态栏高度”属于无源之水——浏览器根本不暴露该信息
H5 端导航栏高度必须写死为 44px
这不是妥协，而是事实标准：iOS/Android 主流 WebView 中，视觉协调、交互舒适、与系统控件对齐的最佳高度就是 44px。uni-app 官方示例、uView、uni-ui 的 H5 导航栏默认都采用此值。
- 固定写法示例：
height: 44px（非 fixed 元素）或top: 0; height: 44px（fixed 导航栏） - 若用
padding-top预留空间，也必须是padding-top: 44px，别算、别猜、别依赖任何运行时值 - 使用 uView 的
uv-navbar时，务必关闭placeholder，否则会额外多占一层空白
三端共用代码时怎么避免 H5 被带偏
靠运行时判断平台（如 uni.getSystemInfoSync().platform === 'h5'）容易出问题：H5 的 API 不可靠，且页面渲染早于回调，首次加载必错位。唯一稳妥方式是条件编译，在编译阶段就剔除无关逻辑。
-
// #ifdef H5块内只写height: 44px和基础样式 -
// #ifdef APP-PLUS块内用var(--status-bar-height)+ 自定义内容高度 -
// #ifdef MP-WEIXIN块内必须结合uni.getMenuButtonBoundingClientRect()计算胶囊位置 - 绝对不要在
data里统一定义navHeight并异步赋值——H5 里这一步注定失败
最容易被忽略的细节
很多人改完样式仍出问题，往往卡在两个地方：一是用了 top: var(--window-top)，这个变量在 H5 里也不稳定；二是自定义导航栏容器（比如 .custom-nav）被其他 CSS 覆盖，比如父级设置了 overflow: hidden 或误加了 transform，导致高度计算失效。真机调试时，直接 inspect 元素看 computed height 和 padding 是否真的生效，比查文档更快。
