How to create: Zebra Striped Table

Learn how to use CSS to create a zebra striped table.

Zebra Striped Table

First Name Last Name Points
Jill Smith 50
Eve Jackson 94
Adam Johnson 67

To create a zebra striped table, please use :nth-child() Selector, and add a background color to all even (or odd) rows:

Example

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

Try it yourself

Related Pages

Tutorial:CSS Table

Reference Manual:CSS nth-child() Selector