ビューポートタグに非常に奇妙な問題があり、それが私を狂わせています..
この記事の例に基づいています: http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/
コード：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=320">
</head>
<body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec tortor turpis, id pharetra purus. Pellentesque venenatis tortor vitae metus varius placerat. Donec eu dui id turpis egestas lobortis.
</body>
</html>
今、iPhoneとAndroidでこのページを見ています。両方の電話で表示されるテキストは、ポートレート モードでは最初の行が consectetur で終わり、ランドスケープ モードでは最初の行も consectetur で終わりますが、テキストが大きくなります。
私が見るのはこれです：
1 番目の画像 (Xn5r7ef)、iPhone 縦向き 2 番目の画像 (mYNvAGR)、iPhone 横向き 3 番目の画像 (7wqmCAX)、Android 縦向き 4 番目の画像 (sFuyxlc)、Android 横向き
ご覧のとおり、Android はテキストのサイズを変更しません。単にテキストを同じサイズに保ち、余分な幅を使用してより多くのテキストを表示します。開発オペラのリンクから、これが起こってはならないことを理解しました。
width=device-width を使用すると、両方の電話で imgur の写真とまったく同じテキストが表示され続けます。つまり、この場合、iPhone ではテキストが正しく表示されません。
ここで何が間違っていますか？私は何か間違ったことをしていますか？これを正しく機能させるにはどうすればよいですか？
明らかに、私の実際のプロジェクトははるかに大きいですが、同様のメタビューポート地獄の問題があります...問題、ページがズームインしすぎているように見え、ページの読み込みごとに、異なるページ（まったく同じビューポートメタタグを持つ）ズーム