IOSのスケーリング属性を理解しようとしています。
Appleの開発者用ドキュメント によると、<meta name="viewport" content="width=device-width">
は、ページが読み込まれたときに(縦向きモードで)、Webページを1:1ピクセル比にスケーリングするようiOSに指示します。
HTML5Boilerplate(スライド13を参照)の人々による プレゼンテーション によれば、device-width
は、デバイスの向きに関係なく、常にiOSデバイスの画面の小さい方の尺度に対応します。
したがって、iOSで<meta name="viewport" content="width=device-width">
宣言横向きでデバイスを保持している間、iOSは画面の高さのように見えるものに従ってビューポートの幅を設定し、1.5:1(iPhone 4s)または2:1(iPhone 5)のピクセル比になります。
「幅」と「デバイス幅」の定義をAppleが使用している)と誤解していますか?
さらに、iOSデバイスが回転すると、ビューポートは何を維持しますか?それは幅ですか、それともスケールですか?メタ設定に依存しますか?
Appleの開発者ドキュメントによると:
「同様に、ビューポートの幅のみを指定すると、高さと初期スケールが推定されます。ランドスケープの向きは、デバイスの幅に等しい幅を維持します。これにより、初期スケールが変更され、ユーザーが横向きに変更しました。」
この記事では、iOSは向きやデバイスの回転に関係なく、同じビューポート設定を維持すると述べています。
「Safariが幅、高さ、初期スケールを推測する方法」の こちら を参照してください。