nth-childジェネレーター
CSSの:nth-child()セレクターを、プレビューを見ながら直感的に作成できる無料ツールです。奇数・偶数・N個ごと・最初のN個などのよく使うパターンにもワンクリックで対応しています。
1. 対象の要素
2. よく使うパターン
3. 詳細設定（an+b）
n +
a・bの値を直接入力しても、下のプレビューと生成コードがリアルタイムで更新されます。
4. プレビュー
※ プレビューは、すべての要素が同じタグである前提で表示しています。:nth-of-type() 系は、実際には同じタグの兄弟要素内でのみ数えられます。
5. 生成されたCSS
an+bの書き方について
an+bとは？
nに0, 1, 2, 3...と順番に整数を当てはめていき、計算結果と一致する順番の要素が選択されます。例えば 2n+1 なら、n=0のとき1番目、n=1のとき3番目、n=2のとき5番目…というように、奇数番目の要素が選ばれます。
代表的なパターン
odd/2n+1：奇数番目even/2n：偶数番目-n+3：最初の3つ3n：3個ごとn+5：5番目以降すべて5：5番目のみ
nth-childとnth-of-typeの違いは？
:nth-child()はタグの種類に関係なく兄弟要素すべての中で数えます。:nth-of-type()は同じタグの兄弟要素の中だけで数えるため、他のタグが混ざっているリストで「同じタグの中でN番目」を指定したい場合に便利です。