微信小程式 rpx單位的理解

2021-08-20 08:03:07 字數 734 閱讀 2308

如何理解rpx?

rpx(responsive pixel): 可以根據螢幕寬度進行自適應。規定螢幕寬為750rpx。如在 iphone6 上,螢幕寬度為375px,共有750個物理畫素,則750rpx = 375px = 750物理畫素,1rpx = 0.5px = 1物理畫素。

小測試:

1、rpx 全稱是什麼?(請填寫英語全稱)

responsive pixel

2、iphone 7 的螢幕寬度對應多少 rpx?

750rpx

3、iphone 7 的螢幕高度對應多少 rpx?

iphone 7 寬高比 375 x 667, 因此螢幕高度對應與 667 / 375 x 750 rpx = 1334 rpx

4、iphone 7 plus 的螢幕寬度對應多少 rpx?

750rpx

5、iphone 7 plus 的螢幕高度對應多少 rpx?

iphone 7 plus 寬高比 414 x 736,因此螢幕高度對應與 736 / 414 x 750 rpx = 1333.33 rpx

6、iphone x 的螢幕寬度對應多少 rpx?

750rpx

7、iphone x 的螢幕高度對應多少 rpx?

iphone x 寬高比 375 x 812,因此螢幕高度對應與 812 / 375 x 750 rpx = 1624 rpx

看完上面的答案你應該已經知道什麼是rpx

微信小程式 尺寸單位rpx與px,rem相互轉換

官方文件 rpx responsive pixel 可以根據螢幕寬度進行自適應。規定螢幕寬為750rpx。如在 iphone6 上,螢幕寬度為375px,共有750個物理畫素,則750rpx 375px 750物理畫素,1rpx 0.5px 1物理畫素。裝置rpx換算px 螢幕寬度 750 px換算...

微信小程式中rpx與rem單位使用

來自 授權位址 rpx單位官方文件 rpx單位基礎介紹 如果看完上面幾篇文章,我們開始進入正題吧 1 js中匯入下面這段 function doc,win if doc.addeventlistener return win.addeventlistener resizeevt,recalc,fal...

微信小程式 單位rpx與px之間的轉換

可以根據螢幕寬度進行自適應。規定螢幕寬度為750rpx.2 個人示例測試 假設我們需要乙個寬為200px,高為200px這樣的a元素模組 我們分別在iphone5和iphone6上測試px與rpx之間的轉換。iphone5 在iphone5上1px等於2.34rpx,那麼200 2.34 468rp...