メディアクエリをCSSに書く方法
メディアクエリをcssに記述する際のメモです。
最近、SWELLなどのブロックエディタで編集する機会が増えてきましたが、それでも小回りを効かそうと思ったらCSSの知識は必須ですね。
特にメディアサイズによって微調整する事はデザインの小回りを効かせる上で非常に有効な手段だと思います。面倒ですが
コピペして使ってください。
1 2 3 4 5 6 7 8 9 10 11 12 13 |
/* 全てのサイズ */ @media screen and (min-width:1200px) { /* 画面サイズが1200pxから */ } @media screen and (min-width:600px) and ( max-width:1199px) { /* 画面サイズが600pxから1199pxまで */ } @media screen and (max-width:599px) { /* 画面サイズが599pxから */ } |
公開日:2023年8月23日
最終更新日:2023年8月23日