メディアクエリのブレイクポイントにもなる、CSSで使うようなピクセルの単位のことを﹁CSSピクセル﹂と言います。︵デバイスピクセルと表記されている場合もあります。︶ メディアクエリで﹁@media (max-width: 〇〇px)﹂というような記述をするかと思いますが、この時の﹁〇〇px﹂が﹁CSSピクセル﹂です。 例えば、iPhone6の画面解像度は 750px × 1334px︵横 × 高さ︶ですが、デバイスピクセル比が2のRetinaディスプレイなので、WEBサイトなどで表示されているサイズは 375px × 667px です。この ﹁375px × 667px﹂の方が﹁CSSピクセル﹂です。 説明のため、﹁画面解像度﹂や﹁デバイスピクセル比﹂という用語も出しましたが、今回のメモではこれらの意味を理解しておく必要は特にありません。 Android端末は少し特殊な解像度の仕組み
![iOS・Android端末のCSSピクセル・dp解像度一覧。レスポンシブでメディアクエリのブレイクポイントは結局何ピクセルなのか?はどこまで対応するかで変わる。(2018年度) | WEMO](https://cdn-ak-scissors.b.st-hatena.com/image/square/c3ddb4104e10f6b652f273d161e5fe70dea81184/height=288;version=1;width=512/https%3A%2F%2Fwemo.tech%2Fwp-content%2Fuploads%2F2018%2F05%2Fthumb_mobile.png)