Sometimes, we want to alternate table row color using CSS.
In this article, we’ll look at how to alternate table row color using CSS.
How to alternate table row color using CSS?
To alternate table row color using CSS, we use the nth-child
pseudo-class.
For instance, we write
table tr:nth-child(odd) td {
// ...
}
table tr:nth-child(even) td {
// ...
}
to select the odd numbered rows with nth-child(odd)
.
And we select the odd numbered rows with nth-child(even)
.
Conclusion
To alternate table row color using CSS, we use the nth-child
pseudo-class.