htmlをiPhoneに対応させる

・縦:portlaitモード(320px)約1/3
・横:landscapeモード(480px)約1/2

(1)metaタグにviewportを使う

<meta name=”viewport” content=”[プロパティ]=[値](, [プロパティ]=[値])”>

initial-scale 倍率の初期値 乗数で指定(例:120%の場合は1.2)
minimum-scale 倍率の最小値 乗数で指定
maximum-scale 倍率の最大値 乗数で指定
user-scalable 拡大縮小の可否 (ye/no)

<meta name=“viewport” content=”width=device-width” />

デバイスにあわせる(スクロール分の余白ができてしまう)

<meta name=”viewport” content=”width=320; initial-scale=1.0; minimum-scale=1.0; maximum-scale=2.0;” />

iPhone用

<meta name=”viewport” content=”width=320; minimum-scale=1.0; maximum-scale=2.0;” />

ベスト

<meta name=”viewport” width=”480, user-scalable=no, maximum-scale=0.6667 />

作りこんだ通りのサイズで、そのまま表示させたい場合