スマホサイトを制作する上で便利だなと思ったコード

備忘録として記録しておきます。少しでも参考になればと思います。

・view port

width=device-width…ウィンドウの横幅をデバイスの横幅（iPhoneの場合は320px）と指定
initial-scale=1 … 表示倍率の初期値
maximum-scale=1 … 表示倍率の最大値
user-scalable=no … ユーザー側の操作で、拡大／縮小を出来るようにするかの可否

・iphoneやAndroidのデフォルト設定を無効にする。

-webkit-appearance: none;

・iphoneのみCSSを適用する

/* iphone.css */
@media screen and (max-device-width: 480px) {
 #help_me { color: red;  }
}

スマホサイト制作を行う上で上記を知っておくとなにかと役に立ちそうです。

スマホサイトは今後も伸びていくと思われます。より多くの技術や役に立ちそうなコードがあれば

載せていきたいと思います。