移動(dòng)開發(fā)的頁(yè)面越來越多嘴脾，然而關(guān)于頁(yè)面尺寸、適配的問題也是我們經(jīng)常遇到的洛搀，我也是出于混亂狀態(tài)敢茁，在網(wǎng)上也看到了很多博客，越看月有些凌亂留美，所以就自己整理一下有關(guān)移動(dòng)開發(fā)的知識(shí)
一彰檬、像素
什么是像素？
像素就是圖像元素（picture element）,即一個(gè)像素就是計(jì)算機(jī)屏幕所能顯示一種特定顏色的最小區(qū)域
像素分為兩類：
1独榴、設(shè)備像素（device pixel）:指的就是設(shè)備的物理像素僧叉，對(duì)于任何一個(gè)設(shè)備他的物理像素的個(gè)數(shù)是不變的奕枝。
2棺榔、css像素：這是一個(gè)抽象的概念，是專門為我們web開發(fā)提供的隘道。
設(shè)備像素和css像素兩者的關(guān)系：在縮放比例為1:1的前提下症歇。
1郎笆、在PC端的瀏覽器下，一個(gè)css像素對(duì)應(yīng)一個(gè)device-pixel忘晤。
2宛蚓、在移動(dòng)端的情況下，會(huì)具體根據(jù)屏幕的特性（比如dpr）,一個(gè)css像素對(duì)應(yīng)的device-pixel的個(gè)數(shù)是不固定的设塔。比如蘋果的Retina視網(wǎng)膜屏幕凄吏，一個(gè)css像素橫跨多個(gè)device-pixel。
總結(jié)：
1闰蛔、像素分為設(shè)備像素和css像素
2痕钢、一個(gè)css像素大小是可變的。比如縮放頁(yè)面比例等序六。但設(shè)備像素是不會(huì)變的任连。
二、屏幕分辨率和屏幕尺寸
我們生活中買電視例诀、筆記本經(jīng)常會(huì)聽到分辨率随抠，那么什么是分辨率？
定義：比如1920 x 1080 ?的分辨率繁涂，就是在一個(gè)移動(dòng)設(shè)備中拱她，縱向有1920個(gè)物理像素塊，橫向有1080個(gè)像素塊扔罪。
屏幕尺寸就是屏幕對(duì)角線的長(zhǎng)度椭懊，比如通常我們說的5.5的屏幕對(duì)角線長(zhǎng)度就是5.5英寸。
三步势、PPI 和 DPR
1氧猬、PPI(pixel per Inch) 每英寸像素?cái)?shù)量，也稱屏幕像素密度坏瘩。PPI 怎么計(jì)算呢盅抚？
2、以上計(jì)算出ppi是為了得到密度分界倔矾，獲得默認(rèn)縮放比例妄均，即設(shè)備像素比DPR（device pixel ratio）
????由上圖可知，ppi在120-160之間的手機(jī)被歸為低密度手機(jī)哪自，160-240被歸為中密度丰包，240-320被歸為高密度，320以上被歸為超高密度（Apple給了它一個(gè)高大上的名字——Retina）壤巷。
????獲得設(shè)備像素比后邑彪，便可得知設(shè)備像素與CSS像素之間的比例。當(dāng)這個(gè)比率為1:1時(shí)胧华，使用1個(gè)設(shè)備像素顯示1個(gè)CSS像素寄症。當(dāng)這個(gè)比率為2:1時(shí)宙彪，使用4個(gè)設(shè)備像素顯示1個(gè)CSS像素，當(dāng)這個(gè)比率為3:1時(shí)有巧，使用9（3*3）個(gè)設(shè)備像素顯示1個(gè)CSS像素释漆。
而 ?CSS像素 =設(shè)備獨(dú)立像素 = 邏輯像素
比如做inpone的設(shè)備像素是750x1334,這就是UI需要設(shè)計(jì)的psd的大小，而前端人員需要根據(jù)dpr進(jìn)行css像素的換算篮迎。
