前端像素大全

一。px

又稱虛拟像素，是css像素的機關。他是一個相對機關，相對于裝置像素而言的。

px具有兩個相對性，其一，相對于同一裝置一個css像素可變；其二，相對于不同裝置，一個css像素可變。

預設情況下一個CSS像素應該是等于一個實體像素的寬度，在浏覽器中的放縮操作，相當于把一個css像素放縮為你的浏覽器放縮倍數乘以一個實體像素的寬度。

*PS:  CSS像素隻是一個相對值。

二。DP

又稱裝置像素（實體像素），機關是pt（ 1pt = 1/72(inch) ）。

顯示屏是由一個個實體像素點組成的，通過控制每個像素點的顔色，使螢幕顯示出不同的圖像，螢幕從工廠出來那天起，它上面的實體像素點就固定不變了，機關pt。

DPR （裝置像素比）= 裝置像素/CSS像素。即dpr個裝置像素等于一個css像素。

三。DIP

又稱邏輯像素（裝置獨立像素）。

CSS像素 =裝置獨立像素 = 邏輯像素

四。DPR

裝置像素比（dpr 描述的是未縮放狀态下，​

​實體像素​

​​和​

​CSS像素​

​的初始比例關系

1.與裝置像素，css像素的關系

dpr=裝置像素/css像素

2.與視口的關系

dpr=螢幕橫向裝置像素/理想視口的寬

PS：裝置像素比(dpr) 是指在移動開發中1個css像素占用多少裝置像素，如2代表1個css像素用2x2個裝置像素來繪制。