css - How to create zebra stripes on html table without using javascript and even/odd classes generation?

Question

I want to zebra-stripe a html table without using any js stuff or writing server-side code to generate even/odd classes for table rows. Is it ever possible to do using raw css?

Answer 1

It is possible, with CSS3 selectors:

tr:nth-child(even) {
  background-color: red;
}


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

According to caniuse.com, every browser supports it now.