一、像素
像素是構成位圖的基本單元，當位圖圖像放大到一定程度時，所看到的一個一個的馬賽克色塊就是像素且像素色塊的大小不是絕對的。
1.物理像素（設備像素）
一個顯示屏的成像原理是通過一系列的小點排列成一個大的矩形，不同的小點通過顯示不同的顏色來顯示成圖像。這每一個小點被叫做一個物理像素（即設備像素）。
2.CSS像素
CSS像素作爲Web開發者我們整天在CSS裏用px作爲長度單位。這裏的px指的是CSS像素。瀏覽器裏的一切長度都是以CSS像素爲單位的。
在非高清屏幕以及未縮放瀏覽器的情況下，一個CSS像素等於一個物理像素；
而在搭載了蘋果公司的視網膜顯示屏等高清屏幕（PPI特別高，一個屏幕上的物理像素點非常多）的設備上，如果一個CSS像素仍等於一個物理像素，那麼網頁上的各種元素就變得非常小，用戶很難看清，因此高PPI的設備中，一個CSS像素通常等於兩個甚至三個物理像素（瀏覽器自動設定，不同瀏覽器設定的會不一樣）。如果一個CSS像素佔用n個物理像素，那麼我們就說此時的dppx（dots per pixel）數爲n。
dppx
dppx是一個單位。設備有多少dppx除了跟設備本身的PPI有關，也和當前的縮放狀態有關，但總的來說不是前端開發者能控制的，而是瀏覽器廠商以及瀏覽器用戶（通過縮放頁面）控制的。桌面瀏覽器上，一個放大到200%的頁面（假如設備不是高清屏），一個CSS像素此時等同於兩個物理像素，即2dppx。
DPR
devicePixelRatio（設備像素比，簡稱DPR）。DPR由瀏覽器廠商確定。
關於物理像素、DPR與視口寬度之間的關係，可詳見如下地址：
鏈接：https://www.zhihu.com/question/35221839/answer/66825618
圖像的像素大小
在位圖圖像所包含的所有像素總量稱爲圖像的像素大小。
二、分辨率
分辨率是指圖像在水平和垂直方向上的所容納的最大像素數，這裏的像素指的是物理像素。
例如分辨率爲1024*768的意思是水平像素數爲1024個，垂直像素數768個，其像素大小爲1024×768=786432，約80萬像素。
三、PPI
屏幕尺寸
指其對角線的長度,用英寸表示,1英寸=25.4毫米。
ppi表示的是每英寸所擁有的像素數目，即在一個對角線長度爲1英寸的正方形內所擁有的物理像素數。
每英寸像素取值（Pixel per inch，簡稱PPI），意思是每一英寸內的物理像素數量，計算公式是
像素色塊越小或者分辨率越高則ppi越大。
目前主流手機的分辨率
安卓：
2560 x 1440
1280 x 720
新增分辨率：
2960x1440
2040x1080
ios :
4 4s 960*640
5 5c 5s se 1 136*640
6 6s 7 8 1334*750
6+ 6s+ 7+ 8+ 1920*1080
新增分辨率： iPhone X 2436×1125（異形屏幕，需要獨立適配）