CSS

nth-of-typeとnth-child擬似クラスの違い

nth-of-typeの記法

要素名:nth-of-type(n)
nの指定によって、スタイルを当てることができる

li:nth-of-type(4)・・・4番目
li:nth-of-type(3n)・・・3の倍数
li:nth-of-type(even)・・・奇数番目
li:nth-of-type(odd)・・・偶数番目

の時にスタイルが当たる

nth-of-typeとnth-childの違い

nth-of-typeは要素内での番目を数える
nth-childは同じ階層の全ての要素を通して数える

p:nth-of-type(2)
p:nth-child(2)

a.html
<div>
   <h1>見出し</h1>
   <p>1つ目</p>  //<= p:nth-child(2)
      <p>2つ目</p>  //<= p:nth-of-type(2)
</div>