CSS中的1px 并不等于設(shè)備的1像素。我們使用Axure 生成的原型是由HTML+CSS+JavaScript 構(gòu)成的。在CSS中，通常使用px（pixel的縮寫，即像素）作為單位，在桌面瀏覽器中，CSS的1px往往都是對應(yīng)著電腦屏幕的一個物理像素，這就是造成我們產(chǎn)生誤解的原因：CSS中的px就是設(shè)備的物理像素。但實際情況并非如此，CSS中的像素只是一個抽象的單位，在不同的設(shè)備或不同的環(huán)境中，CSS中的1px 所代表的設(shè)備物理像素是不同的。在為桌面瀏覽器設(shè)計的網(wǎng)頁中，這樣理解是正確的，但在移動設(shè)備上并非如此，各位讀者必須清楚這一點。在較早期的移動設(shè)備中，屏幕的像素密度都比較低，比如iPhone3，它的屏幕分辨率是320×480像素。在iPhone3上，CSS中1px確實是等于一個屏幕物理像素的。但是隨著技術(shù)的發(fā)展，移動設(shè)備的屏幕像素密度越來越高，從iPhone4開始，蘋果公司便推出了Retina 屏幕，分辨率提高了一倍，變成640×960像素，但屏幕尺寸卻沒變化（在大家使用iPhone4截取屏幕時就能深切體會到這一點，屏幕截圖尺寸是640×960像素，截圖的尺寸比視覺上看到的屏幕尺寸大出了一倍）。也就是說，在同樣大小的屏幕上，像素卻高出了一倍。此時， CSS中1px就等于兩個物理像素。

其他品牌的移動設(shè)備也是這個道理。例如，安卓設(shè)備根據(jù)屏幕像素密度可分為ldpi、mdpi、hdpi、xhdpi 等不同的等級，分辨率也是五花八門。安卓設(shè)備上的CSS中1px相當(dāng)于多少個屏幕物理像素，也因設(shè)備的不同而不同，沒有一個標(biāo)準(zhǔn)。

還有一個因素，昆明網(wǎng)站制作小編認為也會引起CSS中px的變化，那就是用戶縮放。例如，當(dāng)用戶把頁面放大一倍，那么CSS中1px 所代表的物理像素也會增加一倍；反之把頁面縮小一倍，CSS中1px 所代表的物理像素也會減少一倍。

看到這里，相信大家心中的謎團已經(jīng)解開了。大家根據(jù)本節(jié)內(nèi)容的講解也可以深入理解“包含視圖接口標(biāo)記”（Include Viewport Tag）是何含義了。

關(guān)于移動設(shè)備中Viewport的專業(yè)文獻，各位讀者可參考PPK的文章，受篇幅所限，這里不再贅述，請參考網(wǎng)址：http://www.quirksmode.org/。

為了方便各位讀者更加清晰、便捷地設(shè)計適用于不同屏幕尺寸的APP 原型，昆明網(wǎng)站建設(shè)小編在附錄中列出了APP 原型尺寸速查表。