微信小程序開發(fā)--從px到rpx:
我一直在想屎媳，我是不是有必要再寫這一節(jié)夺溢，還是給大家提供一些閱讀鏈接。
因為關(guān)于單位的定義都是比較官方的烛谊。沒什么好討論的风响，我這里做一個匯總和簡單的說明吧。
首先本文只以移動設(shè)備為例說明丹禀。
本文摘要：設(shè)計師以iphone6為標準出設(shè)計稿的話状勤，1rpx=0.5px=1物理像素。Photoshop里面量出來的尺寸為物理像素點双泪。所以可以直接使用標注尺寸數(shù)據(jù)持搜。
--------------------------------------看懂本文摘要的話，就不用閱讀下面的內(nèi)容了-------------------------------------
【英寸Inch】英寸表示屏幕斜對角線的長度焙矛。如下圖所示：
【像素Pixel】像素是圖像的基本采樣單位葫盼，它不是一個確定的物理量，因為像素點的物理大小是不確定的村斟。如圖:
【分辨率】分辨率是屏幕像素的數(shù)量贫导，一般用屏幕寬度的像素點乘以屏幕高度的像素點。如描述iphone6的分辨率是750*1334.
分辨率又分為【物理分辨率】和【邏輯分辨率】邓梅，值得注意的是實際工作中設(shè)計師常常給的是物理分辨率，程序中用到的是邏輯分辨率邑滨，但是都稱為分辨率日缨，容易混淆。
【物理分辨率】是硬件所支持的分辨率掖看，【邏輯分辨率】是軟件可以達到的分辨率匣距。
物理分辨率和邏輯分辨率的商稱為【像素倍率dpr】面哥，也就是常說的幾倍屏。
如下圖中所示毅待，iphone6的分辨率寫著375*667尚卫，這里指的就是它的邏輯分辨率。我們上面提的750*1334則是它的物理分辨率尸红。
所以iphone6的像素倍率=（750*1334）/（375*667）=2
理解了上述的幾個概念吱涉，我們就可以接著來看下面的幾個單位。
【px】px就是Pixel的縮寫外里，就是指像素怎爵。這個作為圖片采樣的基本單位，沒什么需要特別說明的盅蝗。
【rem】在做移動端適配是最常用的方法就是使用rem作為單位鳖链，因為rem是根據(jù)html的fontsize去動態(tài)計算實際的px的。
所以常常應(yīng)用這點墩莫，做反向使用芙委。即根據(jù)屏幕大小動態(tài)的設(shè)置fontsize.來達到不同的分辨率下有一樣的效果。
【rpx】rpx其實是微信對于rem的一種應(yīng)用的規(guī)定狂秦，或者說一種設(shè)計的方案灌侣，官方上規(guī)定屏幕寬度為20rem，規(guī)定屏幕寬為750rpx故痊。
所以在微信小程序中1rem=750/20rpx顶瞳。
但是這不是我們要關(guān)注的重點。
在使用rem時愕秫，我們常常讓設(shè)計師根據(jù)iphone6的標準出設(shè)計稿慨菱。因為如果以iphone6為標準，并且在iphone6上將fontsize設(shè)置成62.5%戴甩。
那么1rem就等于10px符喝，我們只要將設(shè)計師標注的尺寸（一般標注的是物理分辨率）除以20就可以得到單位為rem的數(shù)值了。
在 iPhone6 上甜孤，屏幕寬度為375px协饲，共有750個物理像素，則750rpx = 375px = 750物理像素缴川，1rpx = 0.5px = 1物理像素茉稠。
css中的px與設(shè)備的物理像素并非絕對的一比一關(guān)系。
px與物理像素的比例與設(shè)備的dpr（像素倍率）有關(guān)把夸。
rpx稱為相對像素值而线，rpx與物理像素也并非絕對的一比一關(guān)系。
wxss將設(shè)備寬定義為750rpx，是以iPhone6的分辨率（750x1334）為基準劃分的膀篮。
也就是說嘹狞，在iPhone6上，1rpx=1物理像素=0.5px誓竿。
因為設(shè)計師標注的尺寸一般是物理分辨率磅网。所以如果以iphone6為標準出設(shè)計稿的話，那么我們就可以不需要經(jīng)過換算直接標準rpx筷屡。
這節(jié)課的內(nèi)容就到這里結(jié)束了涧偷。
感謝您的閱讀。
