CSSの疑似クラス「:nth-child(n)」の書き方のパターン
2025年11月28日

11月の終わりがあと残り数日…
本格的な寒さになってきましたね。
でも、昼間はちょっと暑さを感じたり寒さを感じてますが、ニュースを見ると北部のほうではもう雪とか始めてるそうですね。
寒さが続く中、インフルエンザも蔓延してるみたいなんですが…
感染しないように気を付けてください。
さてと、話題を取り戻して…
CSSの疑似クラス「:nth-child(n)」の書き方のパターン
Webデザインの忘備録として書き込みます。
:nth-childの書き方のパターンの種類があります。
一番最初だけ限定とした書き方をするなら「:first-child」を書きます。
または、「:nth-child(1)」と書きますが、プロのデザイナーとしてはほとんど書く人は全く見かけません。
プロが作ったWebサイトの中身のコーディングを見るとほとんど90%は「:first-child」を書く人が多いですね。
2番目限定とか、3番目限定とした書き方をするのであれば「:nth-child(n)」を記述します。
(n)の中に何番目だけ限定とした表示を書くことができます。
偶数だけ表示をしたいときは「:nth-child(even)」を書き、奇数だけ表示をしたいときは「:nth-child(odd)」を書きます。
使い方の意味は分かりましたでしょうか?
では、また!






