官方文件:
rpx(responsive pixel): 可以根據螢幕寬度進行自適應。
規定螢幕寬為750rpx。
如在 iphone6 上,螢幕寬度為375px,共有750個物理畫素,則750rpx = 375px = 750物理畫素,1rpx = 0.5px = 1物理畫素。
裝置rpx換算px (螢幕寬度/750)
px換算rpx (750/螢幕寬度)
iphone5
1rpx = 0.42px
1px = 2.34rpx
iphone6
1rpx = 0.5px
1px = 2rpx
iphone6 plus
1rpx = 0.552px
1px = 1.81rpx
注意:在較小的螢幕上不可避免的會有一些毛刺,請在開發時盡量避免這種情況。
使用@import
語句可以匯入外聯樣式表,@import
後跟需要匯入的外聯樣式表的相對路徑,用;
表示語句結束。
示例**:
/** common.wxss **/
.small-p
@import "common.wxss";
.middle-p
框架元件上支援使用 style、class 屬性來控制項的樣式。
目前支援的選擇器有:
選擇器樣例
樣例描述
.class
.intro
選擇所有擁有 class="intro" 的元件
#id#firstname
選擇擁有 id="firstname" 的元件
element
view
選擇所有 view 元件
element, element
view, checkbox
選擇所有文件的 view 元件和所有的 checkbox 元件
::after
view::after
在 view 元件後邊插入內容
::before
view::before
在 view 元件前邊插入內容
微信小程式 單位rpx與px之間的轉換
可以根據螢幕寬度進行自適應。規定螢幕寬度為750rpx.2 個人示例測試 假設我們需要乙個寬為200px,高為200px這樣的a元素模組 我們分別在iphone5和iphone6上測試px與rpx之間的轉換。iphone5 在iphone5上1px等於2.34rpx,那麼200 2.34 468rp...
微信小程式 rpx單位的理解
如何理解rpx?rpx responsive pixel 可以根據螢幕寬度進行自適應。規定螢幕寬為750rpx。如在 iphone6 上,螢幕寬度為375px,共有750個物理畫素,則750rpx 375px 750物理畫素,1rpx 0.5px 1物理畫素。小測試 1 rpx 全稱是什麼?請填寫英...
微信小程式中rpx與rem單位使用
來自 授權位址 rpx單位官方文件 rpx單位基礎介紹 如果看完上面幾篇文章,我們開始進入正題吧 1 js中匯入下面這段 function doc,win if doc.addeventlistener return win.addeventlistener resizeevt,recalc,fal...