メディアクエリとブレイクポイント設定

メディアクエリとは?

・ブラウザの画面サイズに応じてCSSのスタイルを設定できる手段

ブレイクポイントとは?

・画面の表示が変わるタイミング

書き方

@media ( max-width: ○○px){

}

＊　メディアクエリ →　@media ( max-width: ○○px)
＊ブレイクポイント → ○○pxの部分

注：通常はセレクタの指定は :○○px ;だが、メディアクエリは :○○px。

セミコロンを付けない！

例 1 ：

・ブレイクポイントが600pxのメディアクエリを書く

@media (max-width: 670px) {

}