在微信小程序开发中,大家尽量使用rpx为单位,
px实际上就是系统级的rem(把页面按比例分割750份,1rpx=window.innerWidth/750),或者scale伸缩布局的width=750
。也就是说,微信小程序的rpx布局帮大家把rem布局的js设置根元素字体尺寸这步省了,用rpx就减少了媒体查询的那些步骤
通过rpx,大家只需要根据750的设计稿写代码即可,不必担心它在各个平台的适配情况,
rem的优势:rem是淘宝移动web端就是采用此方案,其中r可以理解成root,不同的页面设置不同页面的根元素的font-size的值,就可以达到响应式布局
或者是媒体查询设置根元素的尺寸
@media screen and (min-width: 320px) {
html {
font-size: 100px;
}
}
@media screen and (min-width: 360px) {
html {
font-size: 112.5px;
}
}
flex布局:flex布局就是流式布局,即宽度永远铺满页面宽度,但高度和其他单位仍然用px