php - CSS - background color of table row odd/even

Question

I have a table that is dynamically generated by PHP. I am hoping that I can use CSS to apply a background color based on where the table row is odd/even, i.e. the background color rotates every other row.

Does that make sense? Thanks!

Answer 1

You can use the nth-of-type() or nth-child() selector in CSS3. Supported by all modern Browsers.

For example...

tr:nth-child(odd) { background-color: #ccc; }

/* Do this… */
tr:nth-of-type(odd) { background-color: #ccc; }

/* …or this */
tr:nth-of-type(even) { background-color: #ccc; }