レスポンシブデザインで制作してるとき、ブレイクポイントは何pxぐらいにしてますか?あとwidthとmax-widthの使い分けのコツがあれば教えて下さい。よろしくお願いします。
間違えました。widthとdevice-widthの使い分けを知っていれば教えて下さい!
<meta name="viewport" content="width=device-width〜→サイトの幅がデバイスの幅になるよ。
<meta name="viewport" content="width=320〜→サイトの幅が320pxになるよ。
拡大縮小も合わせてこのサイトがわかりやすいかもttp://tech.nitoyon.com/ja/blog/2013/02/15/viewport/
ありがとうございます!ちょっと読んできます!
伸び縮みできないようなデザインの時→width指定(※ただしAndroid2系は対象外。対象にするとJSで無理やり縮小する羽目になって大変)伸び縮みできるようなデザインの時→device-width指定
ブレイクポイントは、あくまで個人的なセオリーでは、スマホ(小)< 480pxスマホ(大)< 720px(ここはデザイン次第で変動する)PC(小)・タブレット < 1400px(ここはデザイン次第で変動する)PC(大)タブレットはPCとデザインを分ける必要はないと思う。かわりに、タブレットでも使えるようなデザインにする。あと、2560pxとかあるようなPC向けになんらか対策する。
中身によって替えてる。別にPCでシングルカラムで表示されたところで問題があるわけではないし。
みんなの回答 3 件
間違えました。widthとdevice-widthの使い分けを知っていれば教えて下さい!
伸び縮みできないようなデザインの時→width指定
(※ただしAndroid2系は対象外。対象にするとJSで無理やり縮小する羽目になって大変)
伸び縮みできるようなデザインの時→device-width指定
中身によって替えてる。
別にPCでシングルカラムで表示されたところで問題があるわけではないし。
関連するトピックス