那麼，咱們一起學習下~
一、2種像素
設備像素
設備像素是指設備中使用的物理像素，又稱硬件像素
css像素
css像素是指css樣式到嗎中使用的邏輯像素。如果在一個設備中，硬件像素數與css像素數相等，將不會產生任何問題。但是，由於視網膜設備的出現，這兩者之間的差異變得越來越大。硬件像素數與css像素數成爲兩種截然不同的像素。
例如在iphone 4設備屏幕中的物理像素是640px*960px，而css邏輯像素數爲320*480px。因此，使用大約4個物理像素來顯示一個css像素。
針對圖像來說，web應用程序開發者們的目標是在儘量保證頁面性能的前提下顯示高質量的圖片。
二、與像素相關的其他單位
什麼是設備像素比(device pixel ratio)？
設備像素比是指設備像素與css像素之間的比例。當這個比率爲1:1時，使用1個設備像素顯示1個css像素。當這個比率爲2:1時，使用4個設備像素顯示1個css像素。當這個比率爲3:1，使用9(3*3)個設備像素顯示1個css像素。
什麼是像素密度？
每英寸中多顯示的像素數=ppi（pixels per inch）。在移動開發領域中，使用ppi來作爲像素密度的單位。最近的移動設備中像素密度如下表所示。
雖然設備像素密度值越高，即每英寸中所顯示像素數越多，設備屏幕中圖像越清晰。但是設備像素密度值與設備像素比之間並沒有直接關係。例如，在Galaxy S IV設備中，設備像素密度爲441ppi，設備像素比爲2，在HTC One設備中，設備像素密度爲468ppi，設備像素比爲3。
與設備像素比像素的dp像素與window.devicePixelRatio
Android設備中 獨立於設備像素密度的dp像素
dp是創建Android應用程序時使用的一種獨立與設備像素密度的像素單位。由於在160dpi(dots per inch：每英寸中顯示的點數)的設備中，1px=1dp，因此在320dpi的設備中，1px=2dp，在480dpi的設備中，1px=3dp。
請注意：這個dp與前文所述設備像素比是兩碼事。
三、關於window.devicePixelRatio
在Wikipedia網頁中記載了各種設備的設備像素比，本文並不進行具體描述。這裏我們只介紹一下window.devicePixelRatio。
在JavaScript腳本程序中，可以使用window,devicePixelRatio取得設備的設備像素比。
window.devicePixelRatio的注意點
另外，在使用window.devicePivelRatio的時候，有一下兩點需要注意:
1. 在Firefox瀏覽器與IE瀏覽器中不支持window.devicePixelRatio。
2、在同一設備中的不同瀏覽器中的window.devicePixelRatio值有可能不同。
例如，在720*1200px的Galaxy Nexus設備中，在Android瀏覽器與Chrome瀏覽器中的window.devicePixelRatio值是2，在Opera瀏覽器中的window.devicePixelRatio值爲2.25.由於在Android瀏覽器與chrome瀏覽器中的css像素數爲360px在Opera瀏覽器中的css像素數爲320px所以設備像素比的計算方式如下所示：
在Android瀏覽器與Chrome瀏覽器中
720 / 360 = 2
在Opera瀏覽器中
720/320 = 2.25
在iphone 5的Safari瀏覽器，Chrome瀏覽器與Opera瀏覽器中的設備像素比分別爲2、2、1.
四、使用媒體查詢表達式
爲了在高分辨率設備中顯示清晰的圖像，可以使用某提查詢表達式-webkit-device-pixel-ratio特性。接下來，我們首先對-webkit-device-pixel-ratio特性做一介紹，然後，介紹媒體查詢表達式的resolution特性，最後，總結下如何爲高分辨率設備使用媒體查詢表達式。
-webkit-device-pixel-ratio
-webkit-device-pixel-ratio原本是針對蘋果的視網膜設備進行開發時爲了將設備像素轉換成css像素時使用的一個媒體查詢表達式特性，後來該特性在Android設備中得到了支持。 在Safari開發者說明中針對這一特性，有着如下所示的定義：
"-webkit-device-pixel-ratio"：蘋果設備中使用的特殊比例：2代表視網膜屏幕，1代表標準屏幕。在Safari 4.0以上瀏覽器中支持。
此處並沒有對該比例進行詳細說明，只說1代表標準屏幕，2代表視網膜屏幕。但是，在iphone 4中的device-pixel-ratio（設備像素比）爲2，設備像素數爲css像素數的2倍(640/320px)，device-pixel-ratio=設備像素數/css像素數
Android設備中的-webkit-device-pixel-ratio
在Android設備開發者專用web網站中，針對-webkit-device-pixel-ratio有着如下所示的定義：
“在Android瀏覽器與WebView瀏覽器中，支持針對特定像素密度創建樣式時所使用的-webkit-device-pixel-ratio。可指定值爲0.75、1與1.5，分別代表低像素密度屏幕、中像素密度屏幕和高屏幕屏幕”。