微信小程序布局中的单位及使用

作者：小蓝xlanll | 2024-03-27 02:16:40

踩

微信小程序布局中的单位及使用

单位：px、rem、rpx、vw、vh、n%

绝对单位，页面按精确像素展示

在PC端经常使用的单位，不用计算，直接使用，一般情况不用考虑设计图纸的来改变页面的大小。就直接采用px,方便快捷但是不能自适应。

相对单位，可理解为”root em”, 相对根节点html的字体大小来计算。

rem和rpx的换算关系：rem: 规定屏幕宽度为20rem；1rem = (750/20)rpx =37.5rpx

这个单位是微信小程序中特有的尺寸单位，也是把页面按比例分割达到自适应的效果。

1px = 750/屏幕宽度 rpx 1rpx = 屏幕宽度/750 px

视口单位。视口表示可视区域的大小。vw和vh是相对长度单位，永远以视口作为参考

系统将视口的宽度和高度都分为100份。1vw占用视口宽度的1%

1vw = 屏幕宽度/100 px

父级容器的宽度百分之几

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小蓝xlanll/article/detail/321223