CSS否定：在隱藏的元素中顯示特定的元素？

假設我們有類似於這種CSS否定：在隱藏的元素中顯示特定的元素？

<div id="navigation"> 
    <div class="nav-block-1">....</div> 
    <div class="nav-block-2">....</div> 
    This is the offer 
    <a href="#"> Report </a> 
</div>

現在我想隱藏的所有包括textelements但不是nav-block-2的元素的元素，所以是有辦法通過它我可以做到這一點？就像使用CSS否定一樣？

我嘗試使用

#navigation :not(.nav-block-2) { 
    display:none; 
}

但這似乎否定甚至NAV-塊2的內部的要素是什麼？我在這裏做錯了什麼？有任何想法嗎？

來源

2012-12-22 Srikanth Rayabhagi

'#navigation：not（.nav-block-2）'會選擇帶有id = navigation和class！= nav-block-2的元素。你需要在兩者之間留出空間來表示孩子。 – Jivings

感謝您指出，它的目的是爲了以前這樣，這仍然不能解決我的問題。 –

現在您並未指定您不希望nav-block-2的子項隱藏，而只是元素本身。 – Jivings

試試這個

#navigation div:not(.nav-block-2) { 
    display:none; 
} 


<div id="navigation"> 
    <div class="nav-block-1">Div 1</div> 
    <div class="nav-block-2">Div 2</div> 
    This is the offer 
    <a href="#"> Report </a> 
</div>

來源

2012-12-22 12:04:20 Hkachhia

也許不是你想要的，但這裏就是我想要做的。

#navigation * { 
    display:none; 
} 
#navigation a { 
    display:inline; 
}

編輯：因爲它在你的問題的評論說，我認爲這是很難做到：不，當有文本週圍沒有標籤。

來源

2012-12-22 12:07:37 Andreas

這將使錨點與文本一起內聯。要測試'＃導航* {display：{}} {display：none; '本身就把文本留在後面。 –

使用此：

#navigation > *:not(.nav-block-2) { 
    display:none; 
}

但是，你不能隱藏單個文本節點。您需要在一段中或至少在<span>標記中放置「這是優惠」以隱藏它，否則您需要隱藏整個#navigation，其中不可避免地包含.nav-block-2。

來源

2012-12-22 12:28:55 Bergi

CSS否定：在隱藏的元素中顯示特定的元素？

回答

相關問題