是否有仅适用于第一个直接子级的 CSS 选择器？

我有以下html

<div class="section">
   <div>header</div>
   <div>
          contents
          <div>sub contents 1</div>              
          <div>sub contents 2</div>
   </div>
</div>

以及以下样式：

DIV.section DIV:first-child 
{
  ...
}

由于某种原因，我不明白这种风格是否被应用到“子内容1” <div>以及"header" <div>.

我认为样式上的选择器仅适用于具有名为“section”的类的 div 的第一个直接子级。如何更改选择器以获得我想要的内容？

您发布的字面意思是“查找部分 div 内的任何 div，并且是其父项的第一个子项。”该子包含一个与该描述相匹配的标签。

我不清楚你是否想要主分区的两个孩子。如果是这样，请使用这个：

div.section > div

如果您只想要标题，请使用：

div.section > div:first-child

使用>将描述更改为：“查找作为节 div 的直接后代的任何 div”，这就是您想要的。

请注意，除 IE6 外，所有主流浏览器都支持此方法。如果 IE6 支持是关键任务，您将必须向子 div 添加类并使用它。否则，不值得关心。