レスポンシブWebデザインのブレークポイントとデバイスの画面サイズ
|
レスポンシブWebデザインのブレークポイントを決める
<<決定したブレークポイント>>
●600px
599以下:6インチ以下のスマートフォン
600〜767:7インチクラスのタブレット
●768px
768〜1039:8〜10インチクラスのタブレット(iPad)
●1040px
1040以上:PC,デスクトップ
●600px
599以下:6インチ以下のスマートフォン
600〜767:7インチクラスのタブレット
●768px
768〜1039:8〜10インチクラスのタブレット(iPad)
●1040px
1040以上:PC,デスクトップ
<主要なタブレット&スマートフォンの画面サイズ>
主要なスマートフォンやダブレット | ブラウザの画面サイズ (ピクセル) |
iPhone4 /4s | 320×480 |
iPhone5/5s/5c iPhoneSE |
320×568 |
Nexus5 | 360×640 |
iPhone6/6s iPhone7 |
375×667 |
Nexus6 |
412×732 |
iPhone6Plus/6sPlus iPhone7Plus |
414×736 |
Nexus7 |
600×960 |
iPad Mini 2,3,4 |
768×1024 |
iPad 3,4, iPad Air iPad Pro 9.7 |
768×1024 |
Nexus10 | 800×1280 |
iPad Pro 12.9 |
1024×1366 |