読者です 読者をやめる 読者になる 読者になる

いろいろ試行錯誤

調べものしたときの覚書きや、仕事でコーディングした時のメモ などなど…

iPhoneでのWeb画面の表示幅設定

スマホ

iPhoneにプリインストールされているブラウザ(Safari)で、画面幅ピッタリに表示する方法。

ドメイン名で切り替え

.mobiドメインだと、無条件にスマホ画面になる。 ※ViewPortを記述しても反映されない。

DOCTYPE宣言で切り替え

HTMLファイルの先頭で↓を記述

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.1//EN">

metaタグのViewPortで切り替え

HEAD内に↓を記述

<meta name="viewport" content="width=device-width"/>

ちなみに、↓は240px固定にする

<meta name="viewport" content="width=240"/>

さらに、↓はピンチイン/アウトで拡大縮小できなくする

<meta name="viewport" content="width=240,user-scalable=no"/>