CSS即時子選擇器

#main .container > div:not(.sites):not(.default) { 
    display: none; 
}

<h1>標記可見，而下面的yui-ge div標記被隱藏。如果>僅適用於直系孩子，我的yui-ge如何將上述CSS應用於它（Chrome和Firefox）。CSS即時子選擇器

<div class='container'> 
    <div class='default selected'> 
     <h1>Page Title</h1> 
     <div class='yui-ge'> //for some reason, this tag remains hidden cause of the above CSS 
      //more div tags 
     </div> 
    </div> 
    //more HTML here 
</div>

更新

看吧：--link REMOVED--

點擊「活泉」標籤....沒有結果顯示的默認活泉標籤 - 他們仍然隱藏。

來源

2011-02-03 Webnet

也許你應該發佈一個更大的例子，並解釋究竟發生了什麼以及你認爲應該發生什麼。 – gnur 2011-02-03 18:16:49

`h1`是否可見？我相信這可能是因爲css規則匹配`div'類與「selected」類中的「default selected」類，因此隱藏了div類「yui-ge」，但它也會隱藏`h1`。那麼`h1`仍然可見？ – Bazzz 2011-02-03 18:22:31

你有這樣的CSS規則：

#main .woot > div:not(.sites):not(.default) { 
    display: none; 
}

此規則適用於#main元素中的所有div，不具有類sites或default，是一個.woot元素的兒童。

您的結構是：

<div id="main"> 
    <div class="woot"> 
     <div class="woot default selected"> 
      <div class="yui-ge"> ... </div> 
     </div> 
    </div> 
</div>

正如你所看到的，.yui-ge DIV不具有類sites也不default，這是一個.woot元素中。因此，它將被隱藏。

的問題是，你必須在有階級woot祖先鏈兩個div。

來源

2011-02-03 18:11:40

如果您隱藏一個元素，它的所有子元素也會隱藏。

來源

2011-02-03 18:11:56 JakeParis

CSS即時子選擇器

回答

相關問題