div：divとその子孫を除外するセレクタではない

Question

RadDivのdivを持つdivの外にあるすべてのdivに、明るい黄色の背景の紫色のフォント色のスタイルを適用する必要があります。

これは、クラスがRadDivのdiv内にネストされているすべてのdivが除外されることを意味します。

以下のように:notセレクタを使用してみましたが、動作しません。 Demo of my situation

質問：どのように私はこのdivの内側にRadDivのクラスを持つdiv要素とすべてのネストされたdivを除外する:notセレクタを指定するのでしょうか？

：いないセレクタがそれほど強力ではありません、それは道にあなたを動作しません：私は

<div>This is a div </div> 
<div class="RadDiv newDiv outerDiv"> 
    <div class="header"> 
     This is the header 
    </div> 

    This is an outer div 

    <div class="alert highlight"> 
     This div stands out 
    </div> 
    <div class="footer disclaimer"> 
    This is the footer part 
    </div> 
    <table> 
     <tr> 
     <td> 
     <div>This is div inside a table element</div> 
     </td> 
     </tr> 
    </table> 
</div> 
<div id="div1">This is div1</div> 
<div id="div2">This is div2</div> 
<style> 
div:not(.RadDiv) div { 
    background-color:lightyellow; 
    color:purple; 
    } 
    .outerDiv { 
     border:1px solid red; 
     font-family:Arial; 
    } 
    .footer { 
    color:lightgray; 
    font-size:small; 
    font-style:italic; 
    } 
    .header { 
    font-weight:bold; 
    } 

Answer 1

は兄弟と同じレベルのすべてのdivを扱います。したがって、親を選択することによって開始：

body > div:not(.RadDiv) { 
    background-color: lightyellow; 
    color: purple; 
} 

子コンビネータ（>）を使用して、唯一のレベルは、標的され、そして:notセレクタ（その子孫を含む）任意の兄弟を除外するために使用することができます。

Revised Fiddle

参考文献：

• 6.6.7. The negation pseudo-class
• 8.2. Child Combinators

Answer 2

を試してみました

div:not(.RadDiv) div { 
    background-color:lightyellow; 
    color:purple; 
    } 

完全なコードは動作しませんしませセレクタもっと複雑な状況ではそれが好きです。あなたが望むものを達成するための最も簡単な方法は、おそらく.RadDivのスタイルを上書きするようになります。

div { 
    background-color:lightyellow; 
    color:purple; 
    } 
.RadDiv, .RadDiv div { 
    background: transparent; 
    color: black; 
}