微信小程序align_微信小程序常用样式汇总

小程序特点：用完即走、低频使用、性能要求低，不支持webview；

• 以iphone6尺寸(750*1334)为视觉稿进行设计；
• iphone6下1px=1rpx=0.5pt iphone6 plux下1px=0.6rpx；
• 使用rpx，小程序会自动在不同的分辨率下进行转换，而使用px为单位不会；

1.设置全局字体样式app.wxss：

text{font-family:MicroSoft yahei;}

2.设置弹性盒子模型：

.container{/*弹性模型*/display:flex;/*垂直方向 列方向 排布*/flex-direction:column;/*居中*/align-items:center;/*要从整体解决排布的问题是最好的方案*/}

3.设置页面全屏样式及背景色：

page{height:100%;background:#b3d4db;}

4.全局设置导航条颜色app.json：

"window": {"navigationBarBackgroundColor": "#405f80"}

5.页面设置导航条颜色和标题*.json:

{"navigationBarBackgroundColor": "#405f80