Question:
I know how to make a horizontally zebra-striped table, that is, each row with alternating colors (the famous color yes and color no).
I wanted to know now how I could by css toggle the colors of the columns: the first column of one color and the second of another, both 'td' and 'th'.
Is there a way to do this in CSS?
Answer:
Assim?
Usando o seletor nth-child
. Dessa forma, credito que não precise de grandes explicações, se for mesmo isso o que deseja:
td:nth-child(odd) {
background-color:#ffffff;
}
td:nth-child(even) {
background-color:#cccccc;
}
<table width="200" border="1">
<tbody>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>