我们如何使用CSS选择整个文档中第一次出现的元素

Question

This问题难倒我

假设我们有这样的结构

<!-- Elements can be dynamic -->
<div>
  <section>

  </section>
  <section>
    <p>1st Para</p>
  </section>
  <section>
    <p>2nd Para</p>
  </section>
  <section>

  </section>
</div>

现在在这种情况下，我如何只选择p元素的第一个实例？

注意：章节可以是动态的，所以

div section:nth-of-type(2) p {
   /* This won't work */
}

Answer 1

单独使用CSS是不可能的。您提到动态生成元素，如果是这种情况，那么我会以编程方式将类放在第一个<p>上并以此方式定位。

通过这样做，您还可以确保跨浏览器兼容性;因为如果它 可能，你肯定必须使用CSS3伪类。

Answer 2

使用p:first，p:second，它会像一个类一样运行，但您不需要在yout html标记中添加.anyclass。希望这会有所帮助。