小程序的尺寸单位rpx和px

rpx(responsive pixel)

是WXSS中引入的新的尺寸单位,可以适配不同的屏幕宽度,规定屏幕宽度为750rpx.

<view style="width:200rpx;height:200rpx;background-color:#00ff00;margin-top:100rpx;margin-left:100rpx;">ic</view>
<view style="width:200px;height:200px;background-color:#00ff00;margin-top:100px;margin-left:100px;">ic</view>

效果展示:

 

 

 

 

 

 

 

 

 

 

 

会明显的感觉到在两种手机模式下,用了px的正方形的位置有了明星的变化,这就是px相对于rpx的缺陷,

换算基准:

以375个物理像素为基准,即在一个宽度为375物理像素的屏幕下,1rpx=1px;

举个例子,在iphone6的屏幕下:

屏幕宽度为375px,共有750个物理像素   1rpx=375/750=0.5px;

一些常用设备的单位换算如下:

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值