江西网站开发费用沈阳seo合作
无论是在什么手机机型下，自定义的导航都和右侧的胶囊水平一条线上。如图下
以上图iphone12，13PRo
以上图是没有带黑色扇帘的机型
以下是调试器看的wxml的代码展示
注意：红色阔里的是自定义导航（或者其他的logo啊，返回之类的都可以）；蓝色阔就是页面的内容模块
以下就上真正的代码：
wxml：
<view class="page"><view class="top-nav-box"><view class="headerTitle" style="height:{{menuHeigth}}px;line-height: {{menuHeigth}}px; padding: {{menuTop-4}}px 0 0 0; z-index: 999; position: fixed;top:0;"><view class="item">历届投稿作品</view></view></view><view class="content-box" style="padding-top: {{menuHeigth+menuTop}}px;">页面内容</view></view>wxss：
.headerTitle {color: #FF5733;font-size: 32rpx;width: 100%;overflow: hidden;background-color: #ffffff;padding-left: 30rpx !important;
}注意：这里其实也就是意思一下谢谢自定义导航的样式，咱们的注重点在于距离手机屏幕上方的距离！
js：
Page({data: {menuTop:0,menuHeigth:0,},async onLoad() {let menu = wx.getMenuButtonBoundingClientRect() // --胶囊信息this.setData({menuTop:menu.top,menuHeigth:menu.height,})},注意：胶囊信息里面 有好多值：有需求可以使用：
注意：蓝色阔就是不胶囊，里面的值，就是以它为参照物的对应值；