微信小程序布局中的单位及使用:px、rem、rpx、vw、vh、n%

[ 2022-12-12 15:59:44 | 作者: admin ]
字号: | |
px:就是 Pixel 的缩写,就是指像素,图片采样的基本单位。

rem:把页面按比例分割达到自适应的效果。规定屏幕宽度为 20 rem,根据屏幕大小动态的设置 fontsize,来达到不同的分辨率下有一样的效果。

rpx:这个单位是微信小程序中特有的尺寸单位,也是把页面按比例分割达到自适应的效果。规定屏幕宽为750rpx,就是把屏幕宽度分成750部分,根据屏幕宽度进行自适应。可与 rem 换算:1 rem = (750/20) rpx =37.5 rpx

如在 iPhone6 上,屏幕宽度逻辑像素为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。所以开发微信小程序时用 iPhone6 作为视觉稿的标准,单位换算相对简单 。

vw:视窗宽度,1vw等于视窗宽度的1%。

vh:视窗高度,1vh等于视窗高度的1%。

n%:父级容器的宽度百分百。
[最后修改由 admin, 于 2022-12-12 16:40:06]
评论Feed 评论Feed: http://blog.xg98.com/feed.asp?q=comment&id=2898

这篇日志没有评论。

此日志不可发表评论。