用于后续同级包含特定项目的元素的选择器 [英] Selector for subsequent sibling of element containing specific item

问题描述

是否有一种CSS方法来选择X类型的元素，该元素位于包含Z类型元素的Y类型元素之后?

Is there a css way to select elements of X type which are after element Y type containing Z type elements?

给出以下html，我只能在Z类型之后，不能在包含Z的Y类型之后.

Given the following html, i could only after the Z type, not after the Y type containing Z.

.y .z:after {
  color: green;
  /* x is not green because it's after y, not z */
}

<span class="y">
  y
  <span class "z">
    z
  </span>
</span>
<span class="x">
  x
</span>

推荐答案

否

因为尚无选择DOM的方法... .

在CSS3下， 没有父选择器 或 先前的兄弟选择器

There is, under CSS3, no parent selector or previous sibling selector.

CSS4提供了> :has > 选择器，在这种情况下，您将可以使用

CSS4 offers the :has selector in which case you would be able to use

.y:has( > .z) + .x

但是，目前，没有浏览器支持此选择器.

However, at present, no browsers support this selector.

注意:::after'element'实际上是一个伪元素，而不是选择器，主要用于为在元素内 插入样式的目的而设计的样式附有::after伪元素的

Note: The ::after 'element' is, in fact, a pseudo-element, not a selector, used primarily, for styling purposes for inserting "content" inside the element to which the ::after pseudo-element is attached.

这篇关于用于后续同级包含特定项目的元素的选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！