您的位置：首页 > 移动开发 > 微信开发

微信小程序设置页面背景色的方式（全局或单页面）

2020-10-23 14:16 441 查看

目录

大概或许可能是自己配置不到位，页面.json 的 window 里配的背景色无效，这里采用了别的方式去实现效果，记录一下自己一机灵想到的解决方式

全局背景色设置

将每个页面的默认背景色设置成灰色，一次配置，所有页面生效

（适用于大多数页面背景颜色一致的情况，特殊页面单独设置即可）

  • 其他页面是默认继承过去的背景色，你不设置用的就是这里设置的

app.wxss

/**app.wxss**/
page {
background-color: rgb(245, 245, 245);
}

单个页面

xxxx.wxss

单个页面最外层包个 

<view class="pageContainer"></view>
作为根容器，来设置样式，给定背景色

  • 关键点 
    min-height: 100vh;
    ：页面最低高度100%屏幕高度 内容不足一屏时，pageContainer 高度就是100%屏幕高度
  • 内容超过一屏时，内容有多高，pageContainer 就有多高
 
/**index.wxss**/
.pageContainer{
min-height: 100vh;
background-color: rgb(245, 245, 245);
}
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航