根據行索引設置html表格的行背景顏色

我有一個GridView，其中ItemTempate包含一個HTML表格。我正在嘗試根據GridViewRow索引設置表格行的類，如下所示。根據行索引設置html表格的行背景顏色

<ItemTemplate> 
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="tblAlternate"> 
<tr class="<%#(Container.RowIndex+1)%2==0?"CustomBGColor":"WhiteBGColor"%>"> 
       ....       
</tr> 
</table> 
</ItemTemplate>

任何人都可以建議如何做到這一點？謝謝。

來源

2014-04-23 user3007740

你可以用普通的css選擇器做到這一點 – Homungus

你能舉個例子嗎？ – user3007740

就像@ SW4在他的回答中顯示的那樣。 – Homungus

您可以使用nth-child CSS選擇器，如：

.tblAlternate tr:nth-child(1){ 
    background:red; 
} 
.tblAlternate tr:nth-child(4){ 
    background:green; 
}

在數量是指數+ 1

在你的代碼（例如從1不是0開始），它看起來像你編碼奇VS偶數行，所以你可以使用：

.tblAlternate tr:nth-child(odd){ 
    background:red; 
} 
.tblAlternate tr:nth-child(even){ 
    background:green; 
}

More on nth-child from MDN

對於給定的正數或n的零值，nth-child（an + b）CSS僞類匹配具有 an + b-1同級元素的文檔樹之前的元素一個父元素。

這可以更清楚地描述是這樣的：匹配的元素是及其所有子後一個元素的廣度孩子已經分裂成每個組元素。

除此之外，這允許選擇器匹配表中的每一行。

來源

2014-04-23 09:21:47 SW4

根據行索引設置html表格的行背景顏色

回答

相關問題