小程序如何改变顶部导航栏颜色 小程序导航栏背景颜色

文章摘要：小程序如何改变顶部导航栏颜色 小程序导航栏背景颜色

小程序改变顶部导航栏颜色的方法：1.创建微信小程序项目；2.utils下的app.json文件中修改全局样式即 […]

小程序改变顶部导航栏颜色的方法：1.创建微信小程序项目；2.utils下的app.json文件中修改全局样式即可。

具体操作步骤如下：

1、首先在创建一个微信小程序项目。

2、在utils下的app.json文件中找到“window”变量，修改它的“navigationBarBackgroundColor”属性值即可。

//修改前的样式

"window":{

    "backgroundTextStyle":"light",

    "navigationBarBackgroundColor": "#fff",

    "navigationBarTitleText": "Weixin",

    "navigationBarTextStyle":"black"

  },

效果图：

//修改后的样式

  "window":{

    "backgroundTextStyle":"light",

    "navigationBarBackgroundColor": "#4A97D9",

    "navigationBarTitleText": "Weixin",

    "navigationBarTextStyle":"black"

  },

效果图：