表格背景顏色每改變一行都會改變

Question

我試圖改變表格的顏色背景，但它只改變了一行除以2.我怎樣才能改變其餘的？

我附上了表和相關CSS的代碼。

CSS

.table-striped{ 
    background: #f8fcff !important; 
    .label { 
    width: 44px; 
    height: 16px; 
    padding-top: 3px; 
} 

]

Answer 1

您需要使用第n個孩子。

這將允許你編輯你想要的行樣式

EXAMPLE

table tr:nth-child(odd) 
{ 
background:red; 
} 

table tr:nth-child(even) 
{ 
background:blue; 
} 

Answer 2

大多數時候斑馬條紋是由準備頁面時指定某些類別的元件來實現。例如，如果您有以下結構

<div id='table'> 
    <div class='row odd'></div> 
    <div class='row even'></div> 
    <div class='row odd'></div> 
    <div class='row even'></div> 
</div> 

，你可以簡單地創建一個CSS指定的某些行屬性，基於.odd和.even選擇。

還有一個選項可以使用JS/jQuery來完成這個後期處理，但它顯然不是最好的方法。