一、前言最近无意中打开“某品会”的小程序端，发现他们的头部布局为啥和公司开发的小程序不一样，自己的只能文字居中，改变背景色。对方的竟然可以设置2行文字，字体也有大有小，感觉非常的高大上。某品会小程序首页：接下来小编带着问题去晚上查相关资料，发现微信7.0.0新增了解决不同屏幕头部问题的终极办法：wx.getMenuButtonBoundingClientRect()有了这个神器支持获取胶囊按钮的高度，轻松解决“留海屏”的适配问题。二、开发废话不多说，直接撸代码......1、代码目录结构│├─components│  └─navBar│       navBar.js│       navBa