午後中ずっとオンラインで解決策を探した後、ここで質問します。ビューポートの問題と、StackOverflow で言及されている他の問題との主な違いは、ポートレート モードでのみアクセスすることです (したがって、回転モードやランドスケープ モードはありません)。これが私の問題です:
基本構造として、それぞれ 44pt- (div-element)、232pt- (input-element)、および 44pt-width (div-element) の 3 つの列を含む Web サイトを作成しました。したがって、ページの最大幅は 320pt で、すべての要素の高さはこれまで <250pt です。
iOS シミュレーター (Mac の XCode 経由) でページをレンダリングすると、iPhone の動作と同じになるはずですが、ページが正しくスケーリングされません。私はすでに次のオプションを試しました:
[no meta-tag]
幅の約 240% を示します
<meta name="viewport" content="width=device-width; initial-scale=1.0;" />
幅の約 70% を示します
<meta name="viewport" content="width=device-width;" />
「width=44pt」を持つ最初の div に注目します。
<meta name="viewport" content="width=320; initial-scale=1.0;" />
幅の約 70% を示します
<meta name="viewport" content="width=320;" />
「width=44pt」を持つ最初の div に注目します。
<meta name="viewport" content="initial-scale=1.0;" />
幅の約 70% を示します
<meta name="viewport" content="initial-scale=1.0;maximum-scale=1.0" />
幅の約 70% を示します
結果は変わりません: Web ページが小さすぎる (ズームアウトしすぎた) 場合もあれば、大きすぎる (ズームインしすぎた) 場合もあります。「初期スケール」値を約 .75 に微調整するだけで、ほぼ望ましい結果が得られます。
iPhone-Safari のエラーは何ですか? meta-viewport タグにはどの引数を使用すればよいですか?