CSS选择一个div一个div后一个div

Question

我有一个登录页面上的验证码

<div id="header"> 
    <div id="homeBanner"> 
     ... 
    </div> 
</div> 
<div id="navigation"> 
    ... 
</div> 

我想选择股利＃导航，但只有当它跟随DIV＃头包含DIV＃ homeBanner。原因是我有一个不同的页面上类似的代码：

<div id="header"> 
    <div id="siteBanner"> 
     ... 
    </div> 
</div> 
<div id="navigation"> 
    ... 
</div> 

我不想影响股利＃导航的风格时，它跟随DIV＃头包含DIV＃siteBanner。这有意义吗？

如何仅在div＃header包含div＃homeBanner时选择div＃navigation？我认为这是：

div#header div#homeBanner > div#navigation 

...但似乎没有工作。

Answer 1

这里的问题是，你试图根据父母的孩子选择父元素的兄弟，这在CSS中是不可能的。

您最好的办法是根据这些信息为#header（或甚至body）添加一个班级，然后利用该班级。

例如：

<div id="header" class="home"> 
    <div id="homeBanner"> 
     ... 
    </div> 
</div> 
<div id="navigation"> 
    ... 
</div> 

此选择（如其他人所说，使用+兄弟姐妹，没有>儿童）：

#header.home + #navigation 

Answer 2

请尝试以下代码：

div#header + div#navigation 

使用+作为兄弟姐妹。