gwt風格的第n個孩子與第一個孩子相撞

Question

我想爲我的FlexTable在GWT中定義一組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元素，因此您需要將其應用於第二條規則中的td元素。

假設你想爲整個第一行中的所有細胞相同的不同的背景：

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

爲了較短，這裏有一個竅門，使用:nth-child(n)匹配所有td元素：

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