pages.json中globalStyle.backgroundColor仅对App端生效，跨平台全局背景应使用App.vue中无scoped的page{background-color:#f8f8f8;}；单页差异需用页面级class+height:100vh实现。
pages.json 里 globalStyle.backgroundColor 不生效？
这是最常踩的坑：在 pages.json 的 globalstyle 节点下写 "backgroundcolor": "#fff"，但 h5 或小程序端完全没反应——因为该字段**仅对 app 端生效**，且只控制「窗口背景色」（即原生容器底色），不作用于 web 渲染层。
真正跨平台生效的全局背景方案是：page CSS 选择器。它不是 class，不能加点，也不能写在 scoped 样式里。
- 必须写在
App.vue的块中（无scoped） - 必须用
page { background-color: #f8f8f8; }，不是.page或view - H5 端依赖此规则；小程序端也认这个选择器；App 端会 fallback 到 native 窗口色（若未设）
单页面想换个背景色，但 page 选择器全局覆盖了？
你不能靠改 page 选择器来局部覆盖——它天生就是全局的。要实现“某一页不同”，得用 CSS 层叠 + 页面级 class 控制。
- 在目标页面的
根节点加一个唯一 class，比如 - 在该页面的
（可带scoped）里写：.page-index { background-color: #ffebee; height: 100vh; } - 必须显式设
height: 100vh或撑满父容器，否则背景色只占内容高度 - 避免用
page选择器写局部样式——它无法被 scoped 隔离，会污染其他页
uni.setBackgroundcolor 在 H5 和小程序里为啥报错？
uni.setBackgroundcolor 是 App 独占 API，调用时若不在 App 环境，控制台会直接抛出 undefined is not a function 或静默失败。
- 不要在
onLoad里无条件调用，先判断环境：if (uni.getSystemInfoSync().platform === 'app') - 参数中
backgroundcolortop和backgroundcolorbottom仅用于 Android 渐变背景，iOS 和所有非 App 平台忽略 - H5/小程序动态换背景，只能走 CSS 类切换或内联
style绑定，例如：
底部安全区发白、和背景色不一致怎么办？
全面屏手机（尤其是 iOS）底部常有一块“安全区”，它的背景默认是白色，而你的 page 背景色可能没透过去，导致割裂感。
- 小程序端需额外加一条：
page::after { content: ''; position: fixed; bottom: 0; left: 0; right: 0; height: env(safe-area-inset-bottom); background-color: inherit; z-index: -1; } - H5 端用
body { padding-bottom: env(safe-area-inset-bottom); }+html, body { background-color: #f8f8f8; }更稳妥 - App 端无需处理——
uni.setBackgroundcolor会自动适配安全区
真正容易被忽略的是：page 选择器在小程序里虽然生效，但若页面用了自定义导航栏（navigationStyle: custom），部分微信版本会丢失该背景，此时必须配合 body 或根 view 的背景双重兜底。
