モバイルサイトの横幅について
2014/08/29
横幅でデザインを切り替える際の横幅の境目について。
Webをレスポンシブル？ってヤツをCSS実装？する際の横幅をいくつにするかで悩む。
※下記のような感じでCSSに書き込む。
@media screen and (max-width: 000px) { xxx{} }
「768px」を境目にするのが無難って言う人がいたのでずっと従っていたんだが・・・
画面サイズを調べると「768px」の次が「800px」。
「768px」も「800px」もそんなに大して変わらないでしょ・・・？とふと思ったので「800px」を境目にしよう。
記述は、下記のような感じになる。
@media screen and (max-width: 799px) { xxx{} }
※「799px以下（800px未満）」って指定にする。
▼モバイルの画面サイズ一覧をまとめてみた。
スマホ、タブレットの高さ・幅一覧
※久しぶりにknockout.jsを触ったけど・・・何気に覚えているもんだね。
chromeのプラグインを使えば確認が簡単とか。UAスイッチャーみたいなヤツ？ 時間があるときに試してみよう。
https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh/related