RWD を使用して Web アプリケーションを構築しています。1024、768、320 など、さまざまな解像度のメディア クエリを作成しました。
以下のメタタグを使用してページ幅を決定しています
<meta name="viewport" content="width=device-width, initial-scale=1" />
解像度が 1136×640 の iPhone 5 などのデバイスはほとんどありません。iPhone で Web ページを開くと、横向きモードで 320 レイアウトが表示されますが、解像度は 1136px 幅です。
CSS ピクセル比が 2 であることはわかっていますが、CSS ピクセル比、メディア クエリの幅、およびデバイス解像度の計算の間のロジックがわかりません。
これを説明し、iPhone の 320 レイアウトを表示する理由を説明する記事またはリンクはありますか。
ありがとうございます。