はじめに
HTML, CSSの学習を進めていく中で，新たに学んだことをアウトプットしていきます．
CSSで１番目，２番目の要素を指定する
- １番目の要素を指定するときは，要素の後ろに
:first-childをつける - N番目の要素を指定するときは，要素の後ろに
:nth-child(N)をつける - 最後の要素を指定するときは，要素の後ろに
:last-childをつける
参考サイト
画面幅によって表示する画像を変える方法
画面幅によって表示する画像を変えるには，HTMLの<picture>タグを使用し，以下のように記述する．
<picture>
<source srcset="画面幅600px以下のときに表示する画像のURL" media="(max-width:600px)">
<img src="画像のURL">
</picture>
参考サイト
セレクタの詳細度
セレクタの書き方によって，詳細度が変わる．詳細度が高いセレクタのCSSが優先して適用される．
例えば，同じ要素でも，main ul li{}という書き方の方が，main li{}よりも詳細度が高い．
ある要素に対して，responsive.css内でのセレクタ詳細度が，stylesheet.css内でのセレクタ詳細度よりも低いと，レスポンシブデザインが適用されないので注意が必要．
stylesheet.cssと同じセレクタの書き方をすれば問題はない．
参考サイト