nth-childとnth-of-typeの使い分け

サイトのコーディングをしていると「先頭や最後の要素のみに対して指定がしたい場合があります。

そんな時に便利な
nth-childとnth-of-typeですが使い分けとしては

nth-child(n)
ｎ番目の指定された要素に適用
指定された要素でなければ未適用
nth-of-type(n)
指定した要素のｎ番目に適用
上記となりますが、

【例】

上記の例で使用すると
h2:nth-child(1)では
最初の要素はh1のため適用はされません

h2:nth-of-type(1)
間にほかの要素を挟んでも初めのh2に適用されます。

nth-childを主に使う人も多いと思いますが、
nth-of-typeも知っておくとコーディングで役に立ちます。