[HTML] スマートフォン向けにWebページを表示する（viewport）
今日は、スマートフォン向けにWebページを表示する方法を記載したいと思います。
スマートフォン向けの設定がされていないと、すんごく小さくページが表示されることがあるはず。 それをスマートフォンの横幅縦幅に合わせて表示するための設定です。
<meta name="viewport" content="width=device-width height=device-height" />
メタ属性で上記の記載をする。そーすると、スマートフォンでも見やすいサイズで表示されます。なお、"content"に設定出来る内容は以下のようです。
content設定一覧
| width | 横幅 | 200～10000まで。device-widthという設定も可能。 |
| height | 縦幅 | 223～10000まで。device-heightという設定も可能。 |
| initial-scale | 初期スケール | minimum-scale～maximumscaleまで。 |
| minimum-scale | 最小スケール | 0～10.0まで。 |
| maximum-scale | 最大スケール | 0～10.0まで。 |
| user-scalable | ユーザーによる拡大縮小を許すかどうか | yes / no |
スマートフォン用Webページ作成には、通常とは異なるコツが必要そうです。イベントも違うみたいだし。色々と学ぶべき事が多いですね(*ﾟ▽ﾟ)ﾉ
