在CSS中积极向前看

Question

我在Perl正则表达式中知道正向前瞻的概念,即q(?=u)匹配aq后跟au,而不是使u成为匹配的一部分.我正在寻找类似于css的东西:我想匹配一个div,然后是一个兄弟姐妹div.specialClass.

<div>..</div>  <!-- div to match -->
<div class="specialClass">..</div>

我玩过+但是匹配div.specialClass,而我想要前面的div.

Answer 1

您还不能声明选择器的哪个部分是主题.主题始终是CSS中选择器的最后一个元素,直到我们获得移动它的能力,可能使用$或!语法.

// Always selects the .specialClass div which follows another div
div + div.specialClass {
    color: red;
}

将来,您可以使用以下语法将第一个div作为主题:

// Selects any `div` preceding any `div.specialClass`
$div + div.specialClass { // or maybe div! + div.specialClass
    color: red;
}

您在此期间唯一的解决方法是使用JavaScript.像jQuery这样的工具会使这非常简单:

$("div + div.specialClass").prev();

现在,它是对div任何前面所有元素的引用div.specialClass.