[CSS]奇数とか偶数とかn番目とか忘れてしまうのでメモ。

奇数とか偶数とかn番目とか忘れてしまうのでメモ。

tableで交互に色つけてーとかn番目の要素だけ背景色変えてーとか、よく忘れます・・・歳ですもん。
てことで、今回は筆者の本当のメモです。すみません。
歳には敵わないのです。




奇数番目に色付ける

要素:nth-child(odd) {
    スタイル
}

See the Pen eJRMNb by mitsuki sagayama (@sagayama) on CodePen.

偶数番目に色付ける

要素:nth-child(even) {
    スタイル
}

See the Pen VeWXee by mitsuki sagayama (@sagayama) on CodePen.

n番目に色付ける

要素:nth-child(n) {
    スタイル
}

See the Pen Qygmym by mitsuki sagayama (@sagayama) on CodePen.

語学力が無いからoddとevenが分からなくなるんです・・・

関連

前にもたぶん投稿したと思うけど・・・

一番最初の要素に色付ける

要素:first-child {
    スタイル
}

See the Pen XXgEdQ by mitsuki sagayama (@sagayama) on CodePen.

一番最後の要素に色付ける

要素:last-child {
    スタイル
}

See the Pen OMgvXj by mitsuki sagayama (@sagayama) on CodePen.

まとめ

まとめも何も、いい加減覚えろって話ですはい。