元素，而不是预期的

。这是因为该选择器作用于的后代元素，而不是直接子元素。为了避免这种歧义，建议使用更明确的选择器，如body > *:first-child，以确保选中的直接子元素中的第一个。

在学习CSS选择器时，我们经常会遇到一些意想不到的结果。今天我们将深入探讨body :first-child选择器的具体作用和选择逻辑。

:first-child 选中了什么

当我们使用如下HTML和CSS代码时：

    
    
    
    


    
CSS选择器学习示例
<p class="highlight">这是一个带有 class="highlight" 的段落。</p>
<p id="unique">这是一个带有 id="unique" 的段落。</p>
<p>这是一个普通的段落。</p>
<p>这是另一个普通的段落。</p>

<div>
    <p>这是 `div` 内部的段落。</p>
</div>

<a href="#">点击我</a>

body :first-child {
background-color: red
}

我们期望body :first-child选择器选中的第一个子元素，即

CSS选择器学习示例