• ベストアンサー
  • 暇なときにでも

レスポンシブデザイン

  • 質問No.9252237
  • 閲覧数114
  • ありがとう数1
  • 気になる数0
  • 回答数1
  • コメント数0

お礼率 94% (123/130)

スマホとPCで同一URLにして
レスポンシブデザインでcssを変えたいのですが
それぞれどのサイズにすればいいのでしょうか?

現在は
@media screen and (max-width: 499px) {
* {
font-size: 1.0em;
}
}

@media screen and (min-width: 500px) {
* {
font-size: 2.0em;
}
}
の様にしていて
500以上だと大きく表示されるようにしています。

私のスマホ(アンドロイド)・PCなら問題ないのですが
一般的な幅を教えてください。

質問者が選んだベストアンサー

  • 回答No.1
  • ベストアンサー

ベストアンサー率 58% (345/586)

一般的には、下記のような解像度(幅)になります。
 iPhoneSE……320px
 Android……360px
 iPhone6/7……375px
 iPhone6/7 Plus……414px
 iPad……768px
 ノートパソコン……1366px
 デスクトップパソコン……1920px

スマホとパソコンでCSSを分けるのであれば、
 @media screen and (max-width: 767px) {}
 @media screen and (min-width: 768px) {}

iPadの768pxが無難かなと思います。この書き方だと、iPadからはパソコン用のCSSになります。あるいはiPadよりも小さいタブレットにあわせて、600pxという数字も考えられます。
お礼コメント
mgmmxlsqdyycu

お礼率 94% (123/130)

ありがとうございます。
投稿日時:2016/11/19 10:42
結果を報告する
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。
AIエージェント「あい」

こんにちは。AIエージェントの「あい」です。
あなたの悩みに、OKWAVE 3,600万件のQ&Aを分析して最適な回答をご提案します。

関連するQ&A

その他の関連するQ&Aをキーワードで探す

ピックアップ

ページ先頭へ