1. 程式人生 > >微信小程式之px、rem、px、vw、vh

微信小程式之px、rem、px、vw、vh

rpx 是微信小程式解決自適應螢幕尺寸的尺寸單位。微信小程式規定螢幕的寬度為750rpx。

無論是在iPhone6上面還是其他機型上面都是750rpx的螢幕寬度,拿iPhone6來講,螢幕寬度為375px,把它分為750rpx後, 1rpx = 0.5px。

這裡寫圖片描述

微信小程式同時也支援rem尺寸單位, rem 規定螢幕的寬度為20rem, 所以 1rem = (750/20)rpx = 37.5 rpx

 

 

vw和vh是css3中的新單位,是一種視窗單位,在小程式中也同樣適用。

  • 小程式中,視窗寬度固定為100vw,將視窗寬度平均分成100份,1份是1vw
  • 小程式中,視窗高度固定為100vh ,將視窗高度平均分成100份,1份是1vh

所以,我們在小程式中也可以使用vw、vh作為尺寸單位使用在佈局中進行佈局,但是一般情況下,百分比+rpx就已經足夠使用了,所以它們的出場機會很少。