我的裝置像素比是多少
你的裝置像素比
—
放大或缩小（Ctrl/Cmd +/−）即可觀察比例变化。所有值都在本機读取。
使用方法
- 開啟頁面 — 您的裝置像素比在頂部顯得較大。
- 在某些系統上使用 Ctrl/Cmd + 或 − 縮放並觀察 DPR 變化。
- 按一下複製以儲存 CSS 或圖片匯出設定的 DPR 值。
常見問题
我的裝置像素比是多少？
裝置像素比 (DPR) 是 window.devicePixelRatio — 有多少實體螢幕像素會對應到一個 CSS 像素。 DPR 為 2 表示 1 個 CSS 像素是用 2×2 物理像素（典型的 Retina/HiDPI）繪製的。
正常的設備像素比是多少？
1 是標準桌面密度。 2 在 Retina Mac 和許多手機上很常見。 3出現在一些旗艦手機上。小數值（例如 1.25）通常來自作業系統顯示縮放或瀏覽器縮放。
為什麼變焦時 DPR 會改變？
由於 CSS 像素和裝置像素之間的關係發生變化，瀏覽器縮放可能會影響某些平台上報告的 DPR。將縮放重設為 100% 後刷新以取得基線讀數。
如何計算實體解析度？
將 CSS 螢幕寬度和高度乘以 DPR。此頁面會在詳細資訊面板中自動顯示 CSS 解析度和實體解析度。
DPR 和螢幕解析度有什麼不同？
螢幕解析度是寬度 × 高度（以 CSS 像素為單位）。 DPR 是物理像素的乘數。您需要兩者來選擇正確的圖像資源大小（@2x、@3x）。
是否有資料發送到伺服器？
不會。 DPR 和螢幕值是從視窗 API 本機讀取的。沒有上傳任何內容。
介紹
什麼是我的裝置像素比 顯示您目前的devicePixelRatio正面和中心 — 該數字告訴您是否處於標準 (1×)、Retina (2×) 或更高密度 (3×) 渲染，CSS 和物理解析度在下面詳細說明。
DPR 解釋了為什麼「1920×1080」螢幕看起來清晰或柔和，為什麼@2x影像很重要，以及為什麼畫布和WebGL緩衝區需要與CSS像素不同的大小。此頁面無需安裝即可從您的瀏覽器讀取即時值。
了解裝置像素比
裝置像素比 (DPR) = 每 CSS 像素的實體像素。
| DPR | Label | 典型裝置 |
|---|---|---|
| 1 | Standard | 許多外接顯示器、舊筆記型電腦 |
| 2 | 視網膜/HiDPI | MacBook Retina，許多手機 |
| 3 | High-density | 部分旗艦手機 |
| 1.25–1.5 | 作業系統擴充 | Windows 顯示比例、分數縮放 |
物理寬度 ≈screen.width × DPR（顯示在詳細資訊面板中）。
常見用例
- 選擇影像資源 — 當 DPR 為 2 或 3 時匯出 @2x/@3x 圖示。
- Canvas 和 WebGL — 使用 DPR 設定後備儲存尺寸以實現清晰的渲染。
- CSS
image-set()和resolution— 驗證適用哪些密度規則。 - 跨機器的 QA — 當佈局在 Retina 與非 Retina 上看起來不同時記錄 DPR。
最佳實踐
- 在記錄基線 DPR 進行記錄之前，將瀏覽器縮放重設為 100%。
- 將 DPR 與what is my screen resolution配對以獲得完整顯示指標。
- 使用what is my viewport size作為佈局寬度 — DPR 不會取代斷點的視窗。
- 對於一體化快照，請開啟device info。