ushiroyubi1's blog

お勉強の記録。備忘録。その他。

CSS3入門 16 n番目に来る要素を指定する

今日は~-childについて学んだ。

参考


#16 n番目に来る要素を指定する | CSS3入門 - プログラミングならドットインストール

nth-childで何番目の要素に適用するか決めれる。
要素を特に指定しない場合は*で何にでも指定してくれる。
()内にoddと書くと、奇数に適用される。
また、同じようにevenと書けば偶数に適用される。
3nなどと書けば3の倍数に適用される。
fist-childやlast-childという頭と終わりにだけ指定する事も出来る。
only-childという、要素が一つしかない場合に適用してくれるものもある。

実際に書くとこんな感じ。

div p:nth-child(2){
color: red
}


first-childやlast-childはli使うときに重宝しそうと思ったら、そんな感じみたいです。

参考

リストの最初と最後だけ違うスタイルを適用したいときのCSS | Stainless Note