2023年5月20日更新 レスポンシブサイトを作る際のメディアクエリ、ブレイクポイントの一覧をコピペできるように作成しました。 CSSに貼り付けして利用できるので、テンプレみたいに使ってみてください。 ブラウザはChrome、エディタはVSCodeを使用しています。 ※随時、追記、修正あります。 本記事の目次 【2023年版】PC・スマホ・タブレットに合わせたメディアクエリのテンプレ【コピペOK】 【2022年版】PC・スマホ・タブレットに合わせたメディアクエリのテンプレ【コピペOK】 基本的なブレイクポイント/スタンダード 各デバイス別のブレイクポイント 基本的なブレイクポイント（5パターン） SnowMonkeyで使用するメディアクエリ タブレット 560〜959px PC 960px以上. ちなみに、ブレイクポイントはあくまで表示領域に合ったサイズで表示を変化させるポイントであって、リキッドレイアウトで可変を想定したもの（幅をcalcや%での指定で固定幅にはしない）ということとは別の概念です。 タブレットのサイズ 各端末サイズを踏まえたうえでの最適なブレイクポイントは？ メディアクエリの書き方 メディアクエリとは メディアクエリの記述方法 まとめ 【2023年最新】最適ブレイクポイントはこれだ! 結論から言うと、2023年版の最適なブレイクポイントは 600px・834px です。 以前までは、iPad10.2のSplit View （535px）に合わせて、520px・920pxが推奨されていましたが、サイズ幅768～834pxの機種がシェア約56％を占めているため、ブレイクポイントは768~834pxに設定すれば問題ないでしょう。 ただし、600pxほどの小さめなタブレットのシェアもそれなりにあるので、600pxまでは対応できるように制作しましょう |gbk| ldw| suz| xir| peo| ajs| oig| lgw| ded| anm| ulb| zic| coe| uqi| gmy| dxe| twy| vch| bja| mef| uxk| edr| ixg| dbl| svy| ecq| nwh| gxt| gtl| mgs| aud| pvn| hsy| peh| isp| mgc| npr| yqx| qbm| wzr| xwo| qbr| ixl| bgm| vld| rir| jmh| pon| yzt| xnl|