gwtスタイルnth-childがファーストチャイルドと衝突する

Question

GWTでFlexTable用のCSSルールのセットを定義したいとします。私は奇数と偶数のすべての組み合わせに対して4つの異なる規則を定義しました。

.myTable tbody tr:nth-child\(odd\) td:nth-child\(odd\) { 
    background: #EEEEDD; 
} 

非常にうまく動作しますが、今はテーブルの最初の行に別のスタイルを定義したいと考えています。私はこのような何かをしようとしました：

.myTable tbody tr:first-child { 
    background: #123456; 
} 

しかし、それは4つの以前のルールでは動作しません。これは無視されます。あなたはテーブルの最初の行のための別のスタイルを定義する方法を提案がありますか？

Answer 1

最初のルールでtdエレメントにバックグラウンドを適用したので、それを第2ルールのtdエレメントに適用する必要があります。

.myTable tbody tr:first-child td:nth-child\(even\), 
.myTable tbody tr:first-child td:nth-child\(odd\) { 
    background: #123456; 
} 

短いが、ここではすべてのtdの要素と一致するように:nth-child(n)を使用して、トリックだことを確認するには：

.myTable tbody tr:first-child td:nth-child\(n\) { 
    background: #123456; 
}