僅限一列中的備用行 - CSS

Question

如何爲我的表中的一列中的備用行着色？這是什麼代碼？

Answer 1

正如@ afranz409所述，理想的解決方案是創建一個類。然而，這可以與CSS特定溶液來完成，用有限的瀏覽器功能（該IE的無瀏覽器< 9）：

table tr:nth-child(2n) > td:nth-child(1) { 
    background-color: #eee; 
} 

換句話說，對於每個交替行中，第一表的列內，填背景顏色#eee。如JsFiddle所示。

對於更多的跨瀏覽器兼容的解決方案，我會建議jQuery的內部使用這個選擇：

$('table tr:nth-child(2n) > td:nth-child(1)').css("background-color", "#eee");

Answer 2

你將不得不設置具體<td>類'，你想有色S，而不是<tr>就像你會爲交替行

Answer 3

你可以使用nth-child()選擇去做。

參見：http://jsfiddle.net/thirtydot/2NxE6/

CSS：

tr:nth-child(2n) > td:nth-child(4) { /* highlight column 4 */ 
    background: #ccc 
} 

這工作在現代瀏覽器，但如果你需要它不會在Internet Explorer中工作，直到版本9

在早期版本的Internet Explorer中工作，以下是您的選擇：

• 使用諸如http://selectivizr.com/之類的東西，可以在較早版本的IE中啓用重要的CSS3支持。
• 改用jQuery代替 - 如果你的網站已經依賴jQuery，這是一個不錯的選擇。
• 使用另一個建議向相關的td元素添加一個類。

Answer 4

因爲你可以這樣做的第一列：

tr:nth-child(odd) > td:first-child { 
    background: green; 
} 
tr:nth-child(even) > td:first-child { 
    background: blue; 
} 

這真的取決於你想要的顏色的列。如果第x列，則可以嘗試td:nth-child(x)。