ブレークポイント
flex:mdなどと使う。
| プレフィックス | 最小幅 | 意味 |
|---|---|---|
sm: | 640px | 小型スマホ〜 |
md: | 768px | タブレット〜 |
lg: | 1024px | PC〜 |
xl: | 1280px | 大画面PC〜 |
2xl: | 1536px | 超大画面〜 |
実務で多い使い方
- md:flex-rowなどと特定条件だけ横並びにする。
- md:hiddenでスマホのみ表示する。
- md:grid-cols-2でPCのみ一列にする。
- md:text-baseで、PCのみ文字サイズ拡大。
- md:p-8でPCのみ余白変更。
この記事へのコメントはありません。