nth-childとnth-of-typeの違いを理解する

nth-child 親要素内のすべての子要素に対して適用され、その中から条件に一致する要素が選択される。 そのため要素の種類に関係なく、すべての子要素が考慮される。 nth-of-type 親要素内の特定の要素タイプ（タグ名）に対して適用され、その中から条件に一致する要素が選択される。 そのため要素の種類に基づいて選択がされる。 具体例 例えば以下のコードがあった時、 nth-child この場合、.example内の直下のdiv要素の中から、3番目の要素（"Item 3"）が赤くなる。 nth-of-type この場合、.example内の直下のdiv要素の中から、同じ種類の要素の中で3番目の要素（"Item 5"）が青くなる。