本文共 343 字，大约阅读时间需要 1 分钟。

在CSS选择器中，div:first-child和div:first-of-type都用于选择父级元素的第一个子元素。然而，它们在具体应用中存在显著区别。

在第二个示例中，子元素的第一个div可以使用div:first-of-type选择，但不适合使用first-child。这表明first-of-type具有更精准的粒度。这种选择在某些框架中尤为重要，例如React项目中使用Emotion进行样式管理。由于Emotion在服务端渲染（SSR）过程中会为父元素添加一个style节点，使用first-child可能导致样式问题。因此，推荐优先采用first-of-type来确保可靠性。

关于兼容性，first-of-type在现代主流浏览器中都得到了充分支持，适用于多数项目场景。