CSS选择器，以获得兄弟姐妹

是否有任何方式使用纯CSS（3）来选择元素的前一个元素与一个特定的类的元素？CSS选择器，以获得兄弟姐妹

即：

HTML：

<div id='element-to-find'></div> 
<div id='box1'></div> 
<!-- a bunch more DOM elements between here ---> 
<div id='box2'> 
     <div id='inner-box'></div> 
</div>

CSS：

#box1{ /*some styling*/ } 
#box2{ /*some styling*/ } 

#box2.active .....

现在，当＃BOX2有我想选择做一些事情来的#element-to-find风格类active。无论如何要完成这个？

来源

2013-05-08 sadmicrowave

在CSS中没有“以前的兄弟”选择器，因此可能不是 – 2013-05-08 22:15:35

他们是兄弟姐妹 – Turnip 2013-05-08 22:15:57

您是否考虑让元素查找还有一个活动类？ – ntgCleaner 2013-05-08 22:17:10

不知道更多的选择器，你可能会使用CSS的：not（）选择器。

div:not(#box1), div:not(#box2) { 
    /*some style here*/ 
}

我只想建议给您的#element-to-find类，以及当您选择BOX2及准备它的样式。

来源

2013-05-08 22:21:04 ntgCleaner

有多个投标CSSWG在[email protected]邮件列表作为先前兄弟组合子：my one（2012），另一1，2（2013年）。

Tab Atkins的共同答案就像“我们已经有了这个主题指标”。为了选择以前的兄弟姐妹的后代（这对前同胞组合者来说是微不足道的，例如.example - UL > LI），他建议使用:matches()功能伪类， :matches(!UL + .example) > LI。科目指标和:matches()目前都处于草稿状态，并且不能在现实世界中使用。

因此，您应该为element-to-find元素添加常规类，或者（如果您的active类不是通过JS添加的，则不太需要）使用JavaScript来模拟以前的兄弟组合功能。

来源

2013-05-08 22:38:12

CSS选择器，以获得兄弟姐妹

回答

相关问题