htmlをiPhoneに対応させる
そもそもwidthは
・縦:portlaitモード（320px）約1/3
・横:landscapeモード（480px）約1/2
（1）metaタグにviewportを使う
<meta name="viewport" content="width=device-width" />
デバイスにあわせる（一番簡単なんだけどスクロール分の余白ができてしまう）
<meta name="viewport" content="width=320; minimum-scale=1.0; maximum-scale=2.0;" />
iPhone用に誰かが作ったやつをちょっと書き換えた（ばっちり！GJ！I think..）
<meta name="viewport" width="480, user-scalable=no, maximum-scale=0.6667" />
作りこんだ通りのサイズで、そのまま表示させたい場合（不明つうか、なんかうまくいかない）
initial-scale 倍率の初期値 乗数で指定（例：120%の場合は1.2）
inimum-scale 倍率の最小値 乗数で指定
maximum-scale 倍率の最大値 乗数で指定
user-scalable 拡大縮小の可否 （ye/no）
（2）CSS振り分け
<link media="only screen and (max-device-width:480px)" href="ipodtouch.css" type="text/css" rel="stylesheet"/>
<link media="screen and (min-device-width:481px)" href="pc.css" type="text/css" rel="stylesheet"/>
ばっちり動きました
・IE用
<!--[if !IE]-->
<link media="only screen and (max-device-width: 480px)"
href="iPhone.css" type="text/css" rel="stylesheet" />
<!--[endif]-->
CSS3
・テキストサイズなど
{-webkit-auto-text-size-adjust:none;}
自動アジャスト機能をオフにする
{line-height: 1.8;}
ラインはいとはこのくらい？
・タッピング
a{-webkit-tap-highlight-color: rgba(00,33,99,0.60);}
・border-radius 角丸
{-webkit-border-radius:10px;}
・box-sizing boxのwidth/heightに余白を含める
{-webkit-box-sizing:border-box;} 余白を含める
{-webkit-box-sizing:content-box;} 余白を含めない
・display:box 横並びのbox
{display:-webkit-box;}
・border-image
なんつーか、bgでボタンや囲みみたいなことができるっす
{border-image:url(background.png) 10 20 / 10px 20px stretch;}
stretch 拡大
repeatくりかえす
roundそのまま（だったか？）
