34

ウェブサイトのモバイル フレンドリー バージョンを作成して、ウェブサイトを小さな画面サイズに対応させ、それに応じて拡大しようとしています。

デスクトップでのサイズ変更時にブラウザーで正しく動作するメディア クエリをいくつか作成しました。

私の iPhone では、サファリは Web サイト全体を縮小するだけで、フルサイズのサイトの縦横比を維持します。メディアクエリを監視するにはどうすればよいですか? 私は何かを逃しましたか?

これは、正しく機能するように努めているサンドボックスへのリンクです。ヘルプや提案をいただければ幸いです。

http://www.preview.brencecoghill.com/

4

3 に答える 3

82

HTMLにビューポートのメタがありますか?

<meta name="viewport" content="width=device-width, initial-scale=1.0">

詳細はこちら: http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-dont-forget-the-viewport-meta-tag/

于 2012-10-22T00:09:42.040 に答える
16

Chrome で ; という警告が表示されると思います。の代わりに、これは問題なく動作するはずです:

<meta name="viewport" content="width=device-width, initial-scale=1">
于 2013-08-21T13:07:21.257 に答える