div~div와 div:not(:first-of-type)의 차이점은 무엇입니까?

둘 다 일치하는 요소 측면에서 동일합니다. 예를 들어 보겠습니다.

<section>
   <div></div> <!-- div:first-child or div:first-of-type -->
   <div></div> <!-- div+div or div~div or div:nth-of-type(2) -->
   <p></p>
   <div></div> <!-- div+p+div or div~div or div:nth-of-type(3),
   but not div+div -->
</section>
<section>
   <h1></h1> <!-- h1:first-child -->
   <div></div> <!-- div:first-of-type or div:nth-child(2) -->
   <div></div> <!-- div~div or div:nth-of-type(2) or div:nth-child(3) -->
</section>

두 선택기가 동일한 요소와 일치하는 CSS 규칙이 있는 경우 div:not(:first-of-type)이 다음으로 인해 우선 순위를 갖게 됩니다. first-of-type pseudo-class.