Html 在具有特定子元素的元素后选择元素

考虑以下HTML：

<p>Foo</p>
<p>
  <br>
</p>
<p>Bar</p> <!-- I want to select this p element -->
<p>Baz</p>

Foo





酒吧

巴兹

CSS中有没有办法选择“包含

br

元素的

p

元素之后的

p

元素”

我知道我可以回过头来使用JavaScript来实现这一点，但我很好奇是否有一些令人生厌的兄弟选择器组合，或者一些我还没有遇到的组合

` Foo

酒吧

Baz

`

如果要选择第三个p，则可以使用伪类：nth-child（）

所以答案应该是第n个孩子（3）

---

如果这些p标记位于容器内，则将其用作组合器以获得所需的结果，否则它将选择html文档中的所有第3个p标记

NB：当然可以使用父选择器，但这并不完全是我在这里要求的。父选择器与CSS的粒度稍有冲突，CSS只在DOM的一个方向上起作用。在我的例子中，我想要处理的元素在我需要知道的所有其他事情之后仍然是，因此不需要返回DOM或执行第二次传递，等等。它仍然被称为父选择器。。。您希望查看元素内部的内容，因此需要先向下，然后再向上，这在CSS中实际上是不可能的（阅读副本，您会发现您需要

：has（）

选择器）。。。基本上，您需要这样做：从

br

开始，检查父项是否为

p

，如果为是，则选择它之后的

p

。。这与：选择包含

br

的

p

，然后选择其后面的p。我想如果我错过了像

：blank

这样可以解决这个问题的东西，我会更喜欢钓鱼，但我想这又回到了JS。如果你感兴趣的话，不管它看起来如何。