:first-child

优质

小牛编辑

125浏览

2023-12-01

描述 (Description)

:first-child伪类用于向一个元素添加特殊效果，该元素是某个其他元素的第一个子元素。

要使:IE中的第一个孩子工作必须在文档顶部声明。

请注意 -

伪类名称不区分大小写。
伪类与CSS类不同，但它们可以组合在一起。

例子 (Example)

例如，要缩进所有

元素的第一段，您可以使用此定义 -

<html>
   <head>
      <style type = "text/css">
         div > p:first-child {
            text-indent: 25px;
         }
      </style>
   </head>
   <body>
      <div>
         <p>First paragraph in div. This paragraph will be indented</p>
         <p>Second paragraph in div. This paragraph will not be  indented</p>
      </div>
      <p>But it will not match the paragraph in this HTML:</p>
      <div>
         <h3>Heading</h3>
         <p>The first paragraph inside the div.This paragraph will not be effected.</p>
      </div>
   </body>
</html>

这将产生以下结果 -