CSS：不使用：不僅排除div，還排除其中的所有div？

我想使用not：所以它會排除div2元素中的所有p元素。這是HTML文件：CSS：不使用：不僅排除div，還排除其中的所有div？

<body> 
    <p> not in any div </p> 
    <div id="div1"> 
     <p> div1 text1</p> 
     <div> 
      <p> div2 inner text2</p> 
      <div> 
       <p> div1 innermost text3</p> 
       <p> div1 innermost text4</p>  
      </div> 
     </div> 
    </div> 

    <div id="div2"> 
     <p> div2 text1</p> 
     <div> 
      <p> div2 inner text2</p> 
      <div> 
       <p> div2 innermost text3</p> 
       <p> div2 innermost text4</p>  
      </div> 
     </div> 
    </div> 

    <div id="div3"> 
     <p> div3 text1</p> 
     <div> 
      <p> div3 inner text2</p> 
      <div> 
       <p> div3 innermost text3</p> 
       <p> div3 innermost text4</p>  
      </div> 
     </div> 
    </div> 
</body>

這是我使用的CSSfile，（顯然）它不工作得好：

div:not(#div2) p{ 
    color:green; 
}

這僅排除p元素有：「DIV2 text1」中，但不在div2內的其他三個：

我相信這是因爲「不：」只排除div2 div，而不是其中的兩個div。

如何更改「：not」內的上下文，以便它不僅包含div2 div，還包括div2內的所有div？

我所試圖做的可以通過使用jQuery easilly實現：

$('div p').not('#div2 p');

總結：如何改變這個CSS行：

div:not(#div2) p{

所以它會做（選擇）與jQuery線相同？或者換句話說：

要選擇div內的所有p元素，除非它是div2。或者換句話說：

要選擇所有p元素包含其中任一詞語DIV1或DIV3（但不使用此信息）

來源

2013-07-02 Roko

這個div真的是3還是隻是個例子？ – Jon

我只想添加一個類到包含需要綠色文本的div。使用該類作爲選擇器。跳過所有這些的頭痛：不是業務。 – Woodifer

到Woodifer，我有像這樣的30個div，我不想爲他們每個人添加一個類 – Roko

您是否嘗試過的孩子選擇？

body > div:not(#div2) 
{ 
    color:orange 
}

這將只針對身體的直接後裔divs。小提琴：

http://jsfiddle.net/Xk5rb/

來源

2013-07-02 22:05:01 Ben

+1打我吧 –

請注意，這隻適用於默認值爲'inherit'的屬性，比如'color'（不適用於例如'border'），因爲您在技術上沒有選擇相關的div。 – Jon

Ben和Zeaklous：實際上工作！謝謝 – Roko

CSS：不使用：不僅排除div，還排除其中的所有div？

回答

相關問題