<resolution>

<resolution>CSSデータ型 で、メディアクエリresolution で使われ、出力端末のピクセル密度である、解像度を表します。

画面では、長さは物理的な値ではなく、 CSS のインチ、センチメートル、またはピクセルと関連づけられます。

構文

<resolution> データ型は、厳密に正の <number> のすぐ後ろに解像度の単位を続けます。他の CSS の寸法と同じく、単位のリテラルと数字の間に空白はありません。

単位

dpi
1 インチあたりのドット数 を表します。画面でよく使われるのは 72 または 96 dpi です。印刷物の dpi は通常、これより大きくなります。1 インチは 2.54 cm なので、1dpi ≈ 0.39dpcm です。
dpcm
センチメートルあたりのドット数 を表します。1 インチは 2.54 cm なので、1dpcm ≈ 2.54dpi です。
dppx
ピクセル (px) あたりのドット数を表します。CSS の in と CSS の px の比率は 1:96 で固定なので、1dppx96dpi と同じです。これは image-resolution で定義される、CSS の画像の既定の解像度に一致します。
x
dppx の別名です。

注記: 仮に値 0 に対しすべての単位が同じ解像度を表すとしても、単位を省略してはいけません。言い換えると 0 は無効で、0dpi0dpcm0dppx のどれも表しません。

メディアクエリで使用する

@media print and (min-resolution: 300dpi) { ... }

有効な解像度

96dpi
50.82dpcm
3dppx

無効な解像度

72 dpi     数値と単位の間に空白は許可されていません。
ten dpi    数値は10進数しか使えません。
0          単位は必須です。

仕様書

仕様書 状態 備考
CSS Values and Units Module Level 4
<resolution> の定義
編集者草案 x 単位を追加
CSS Values and Units Module Level 3
<resolution> の定義
勧告候補 dppx 単位を追加
Media Queries
<resolution> の定義
勧告 初回定義

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
<resolution>Chrome 完全対応 29Edge 完全対応 12Firefox 完全対応 8
完全対応 8
部分対応 3.5
補足
補足 Supports <integer> values only.
IE 完全対応 9Opera 完全対応 9.5Safari 未対応 なし
補足
未対応 なし
補足
補足 See bug 78087.
WebView Android 完全対応 ≤37Chrome Android 完全対応 29Firefox Android 完全対応 8
完全対応 8
部分対応 4
補足
補足 Supports <integer> values only.
Opera Android 完全対応 ありSafari iOS 未対応 なし
補足
未対応 なし
補足
補足 See bug 78087.
Samsung Internet Android 完全対応 1.5
dpcm unitChrome 完全対応 29Edge 完全対応 12Firefox 完全対応 8IE 完全対応 9Opera 完全対応 16
完全対応 16
未対応 10 — 15
Safari 未対応 なしWebView Android 完全対応 ≤37Chrome Android 完全対応 29Firefox Android 完全対応 8Opera Android 完全対応 16
完全対応 16
未対応 10.1 — 14
Safari iOS 未対応 なしSamsung Internet Android 完全対応 あり
dpi unitChrome 完全対応 29Edge 完全対応 12Firefox 完全対応 8IE 完全対応 9Opera 完全対応 16
完全対応 16
未対応 10 — 15
Safari 未対応 なしWebView Android 完全対応 ≤37Chrome Android 完全対応 29Firefox Android 完全対応 8Opera Android 完全対応 16
完全対応 16
未対応 10.1 — 14
Safari iOS 未対応 なしSamsung Internet Android 完全対応 あり
dppx unitChrome 完全対応 29Edge 完全対応 12Firefox 完全対応 16IE 未対応 なしOpera 完全対応 12.1Safari 未対応 なしWebView Android 完全対応 ≤37Chrome Android 完全対応 29Firefox Android 完全対応 16Opera Android 完全対応 12.1Safari iOS 未対応 なしSamsung Internet Android 完全対応 あり
x unitChrome 完全対応 68Edge 未対応 なしFirefox 完全対応 62IE 未対応 なしOpera 完全対応 ありSafari 未対応 なしWebView Android 完全対応 68Chrome Android 完全対応 68Firefox Android 完全対応 62Opera Android 完全対応 ありSafari iOS 未対応 なしSamsung Internet Android 未対応 なし

凡例

完全対応  
完全対応
未対応  
未対応
実装ノートを参照してください。
実装ノートを参照してください。

関連情報