Tables with alternating backgrounds
using CSS

Sometimes it’s nice to have a table or list whose background colors alternate. It’s easy to generate such formatting automatically. But if you make the list by hand, it’s not so easy: you have to explicitly specify the color of each row in the list. And then you want to add a single row somewhere in the middle? Oy!

The modern solution is to use the CSS3 nth-child selector. Previously I had used JavaScript for this purpose, but CSS is much lighter-weight and easier. (And faster and more robust and...)

This works only in relatively modern browsers (since around 2012): MSIE 9.+, Firefox 3.5+, Safari 3.2+, Opera 9.6+. Chrome 4.+.