首先說一個很有意思的問題：一塊720p的屏幕和1080p的屏幕那個大？ 這個問題很有代表性，如果手機豎著放，720p=720px*1280px,而1080p=1080px*1920px;那麼在寬度上，前者是720個像素，後者是1080個像素，後者一定比前者大嗎？ 答案是否定的，後者不一定比前者大，還 ...
首先說一個很有意思的問題：一塊720p的屏幕和1080p的屏幕那個大？
這個問題很有代表性，如果手機豎著放，720p=720px*1280px,而1080p=1080px*1920px;那麼在寬度上，前者是720個像素，後者是1080個像素，後者一定比前者大嗎？
答案是否定的，後者不一定比前者大，還可能和前者一樣大，甚至比前者小。
這裡需要搞清楚一個概念，像素點只有個數的問題，沒有大小的問題。那什麼才和大小有關呢？是邏輯解析度（pt）,我們來看一張表格：
|
型號 |
屏幕尺寸（inch） |
邏輯解析度（point） |
render |
物理解析度（pixel） |
像素密度（PPI） |
|
iPhone3GS |
3.5 |
320 * 480 |
@1x |
320 * 480 |
163 |
|
iPhone4/4s |
3.5 |
320 * 480 |
@2x |
640 * 960 |
326 |
|
iPhone5/5s |
4 |
320 * 568 |
@2x |
640 * 1136 |
326 |
|
iPhone6/6s |
4.7 |
375 * 667 |
@2x |
750 * 1334 |
326 |
|
iPhone6Plus/6s Plus |
5.5 |
414 * 736 |
@3x |
1242 * 2208 |
401 |
其實我們可以這麼理解：屏幕尺寸決定邏輯解析度，它們之間是有對應關係的，但是這個換算關係涉及到屏幕的柵格渲染，較為複雜。所謂邏輯解析度，就是一個物理長度的單位。而這裡的render指的是每個pt中包含幾個px。比如iPhone3GS和iPhone4s，實際尺寸都是3.5英寸，即都是320pt*480pt，但是由於在4s中每個pt可以包含2個px了，所以顯示更加細膩了。
一句話就講明白了：邏輯解析度決定屏幕尺寸，物理解析度指向顯示細膩程度。
為什麼是指向呢？因為細膩程度（ppi）是這樣計算的：
這樣就很明白了。
那麼小程式開發中，這一塊最有意思的是，它在設計rpx這玩意的時候，完完全全就是以iPhone6為模板的。在且只在iPhone6中，1px=1rpx=0.5pt。
也就是說，對於一張設計稿，只要物理解析度和iPhone6保持一致，為750px*1334px,按照1:1的換算關係在小程式中寫成rpx，那麼這個佈局和比例在任何設備顯示都是一致的。
因為使用rpx，小程式會自動在不同解析度的設備中進行自適應轉換，而使用px就不會。
