css 3 nth-childセレクタ

css 3 nth-childセレクタ
css 3のnth-childセレクタは、一見簡単に見えますが、実はそんなに簡単ではありません.
簡単な使い方

p:nth-child(n) //           n        
   
p:nth-child(2n) //                  
   
p:nth-child(2n + 1) //                  
   

注意事項
おそらく、上記の使い方はご存知のようですが、ちょっとわからないことがあると使いづらいです.それがnとは何ですか.
nは0から始まる正の整数であり、0,1,2......のシーケンスを表す.こんなの.
しかし:nth-child(n+m)のn+mは1から計算され、すなわちサブエレメントの先頭計算シーケンス番号は1であり、0のようなエレメントは存在しない.最初の要素は1で、0ではありません.これは,プログラム内の配列開始番号やjQueryのセレクタとは異なる.
これでよく理解できます.どの要素を選択するかは、nのインクリメントから算出されたパラメータの値を親要素の位置シーケンスに対応させるだけでよい.
たとえば、最初の要素を検索します.

:nth-child(1)

検索シーケンスが10以上の要素

:nth-child(n+10)

このまま
css 3には他にもサブエレメントセレクタがあります
たとえば

:first-child //      
:last-child    //       
:nth-last-child //             ，n  0  ，           1，    

お互いに助け合って、やはり使いやすいです.