【像素Pixel】像素是圖像的基本采樣單位，它不是一個(gè)確定的物理量，因?yàn)橄袼攸c(diǎn)的物理大小是不確定的。如圖:

【分辨率】分辨率是屏幕像素的數(shù)量，一般用屏幕寬度的像素點(diǎn)乘以屏幕高度的像素點(diǎn)。如描述iphone6的分辨率是750*1334.

分辨率又分為【物理分辨率】和【邏輯分辨率】，值得注意的是實(shí)際工作中設(shè)計(jì)師常常給的是物理分辨率，程序中用到的是邏輯分辨率，但是都稱為分辨率，容易混淆。

【物理分辨率】是硬件所支持的分辨率，【邏輯分辨率】是軟件可以達(dá)到的分辨率。

物理分辨率和邏輯分辨率的商稱為【像素倍率dpr】，也就是常說的幾倍屏。

如下圖中所示，iphone6的分辨率寫著375*667，這里指的就是它的邏輯分辨率。我們上面提的750*1334則是它的物理分辨率。

所以iphone6的像素倍率=（750*1334）/（375*667）=2

理解了上述的幾個(gè)概念，我們就可以接著來看下面的幾個(gè)單位。

【px】px就是Pixel的縮寫，就是指像素。這個(gè)作為圖片采樣的基本單位，沒什么需要特別說明的。

【rem】在做移動(dòng)端適配是最常用的方法就是使用rem作為單位，因?yàn)閞em是根據(jù)html的fontsize去動(dòng)態(tài)計(jì)算實(shí)際的px的。

所以常常應(yīng)用這點(diǎn)，做反向使用。即根據(jù)屏幕大小動(dòng)態(tài)的設(shè)置fontsize.來達(dá)到不同的分辨率下有一樣的效果。

【rpx】rpx其實(shí)是微信對(duì)于rem的一種應(yīng)用的規(guī)定，或者說一種設(shè)計(jì)的方案，官方上規(guī)定屏幕寬度為20rem，規(guī)定屏幕寬為750rpx。

所以在微信小程序中1rem=750/20rpx。

但是這不是我們要關(guān)注的重點(diǎn)。

在使用rem時(shí)，我們常常讓設(shè)計(jì)師根據(jù)iphone6的標(biāo)準(zhǔn)出設(shè)計(jì)稿。因?yàn)槿绻詉phone6為標(biāo)準(zhǔn)，并且在iphone6上將fontsize設(shè)置成62.5%。

那么1rem就等于10px，我們只要將設(shè)計(jì)師標(biāo)注的尺寸（一般標(biāo)注的是物理分辨率）除以20就可以得到單位為rem的數(shù)值了。

在 iPhone6 上，屏幕寬度為375px，共有750個(gè)物理像素，則750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。
css中的px與設(shè)備的物理像素并非絕對(duì)的一比一關(guān)系。

px與物理像素的比例與設(shè)備的dpr（像素倍率）有關(guān)。

rpx稱為相對(duì)像素值，rpx與物理像素也并非絕對(duì)的一比一關(guān)系。

wxss將設(shè)備寬定義為750rpx，是以iPhone6的分辨率（750x1334）為基準(zhǔn)劃分的。

也就是說，在iPhone6上，1rpx=1物理像素=0.5px。

因?yàn)樵O(shè)計(jì)師標(biāo)注的尺寸一般是物理分辨率。所以如果以iphone6為標(biāo)準(zhǔn)出設(shè)計(jì)稿的話，那么我們就可以不需要經(jīng)過換算直接標(biāo)準(zhǔn)rpx。

這節(jié)課的內(nèi)容就到這里結(jié)束了。

感謝您的閱讀。