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

Question

这个问题把我难住了

假设我们有这样的结构

<!-- 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

use p:first，p:second它会像一个类一样工作，但你不需要添加你.anyclass的 html 标签。希望这可以帮助。