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 

使用+作爲兄弟姐妹。