CSS：1レベルだけカスケードする

Question

CSSクラス（<テーブルクラス= "x">）が定義されている<テーブルを持っていて、私は<の最初のレベルの 'color'これは関連するクラスにクラスを設定せずにCSSを使用すると可能ですか？< td>？

I.e.

<table class="x"> 
    <tr> 
     <td> 
      xxxx 
      <table><tr><td>yyy</td><tr></table> 
     </td> 
    </tr> 
<table> 

私はxxxxは色を変更したい - 私はしたいときに.x td{color:red;}は現在、XXXXとYYYYに適用される対象とXXXXのではなく、XXXXのTDにクラス名を与えないだろう

Answer 1

2つ目のレベルを任意の値に設定してカスケード効果を無効にすることもできます。これにより、最上位レベルのエフェクトをキャンセルすることができます。このような

何か：

table.x tr td { ...} 

table.x tr td table tr td { ... } 

最初の文は.Xテーブルの下にあるすべてのtdのに適用されますが、その後、2番目のステートメントは、内側の入れ子のレベルのためにそれを上書き（およびそれ以下のもの）します。最初のステートメントの後に来るので、上記のステートメントで設定されたものはすべて上書きされます。

これはまた、子どもよりも祖先/子孫のより基本的な構成を使用しているため、IEでも機能しますが、これもサポートされていません。

Answer 2

はこれを試してみてください。

table.x > tr > td { ... } 

>は、直接の子セレクタである。