iOS(iPhone)の各パーツサイズ メモ
【Normal】
Status bar: 20px
URL text field: 60px
Button bar: 44px
【Keyboard】
キーボードが表示された時
Status bar: 20px
URL text field: 60px
Form assistant: 44px
Keyboard: 216px(Portrait), 162px(Landscape)
Button bar: 44px(Portrait), 32px(Landscape)
【Display】
スクリーンサイズ
iPhone 4s under
320px x 480px
iPhone 5
320px x 568px
・表示可能領域
【Normal】
iPhone 4s under
320px x 356px
*hide URL text field
320px x 416px
iPhone 5
320px x 444px
*hide URL text field
320px x 504px
【Standalone mode(Full Screen)】
iPhone 4s under
320px x 460px
iPhone 5
320px x 548px
【meta】Standalone mode
Full screen指定
iOS 2.1 later
<meta name="apple-mobile-web-app-capable" content="yes"> |
default: no
yes, no
Status bar
iOS 2.1 later
<meta name="apple-mobile-web-app-status-bar-style" content="black"> |
default: default
default, black, black-translucent
【Web クリップ アイコン】Web Clip Icon
iPhone
57 x 57, 114 x 114(高解像度)
iPad
72 x 72, 144 x 144(高解像度)
四角形のアイコンを作成(PNG)
角丸、ドロップシャドウ、反射光 はiOS側で設定される
画像名を apple-touch-icon-precomposed.png とすると上記3つの効果を付けない。
【関連投稿】
Memo, [iOS][mobile Safari]フルスクリーンに対応させるmetaタグやスプラッシュ画像の指定
Memo, iOS, Androidブラウザのアドレスバーを消す方法