CodePen Embed - Applying Styles to Odd and Even Rows Example

<table>
    <tr>
        <td>Row 1, Column 1</td>
        <td>Row 1, Column 2</td>
    </tr>
    <tr>
        <td>Row 2, Column 1</td>
        <td>Row 2, Column 2</td>
    </tr>
    <tr>
        <td>Row 3, Column 1</td>
        <td>Row 3, Column 2</td>
    </tr>
    <tr>
        <td>Row 4, Column 1</td>
        <td>Row 4, Column 2</td>
    </tr>
    <tr>
        <td>Row 5, Column 1</td>
        <td>Row 5, Column 2</td>
    </tr>
  
    <tr>
        <td>Row 6, Column 1</td>
        <td>Row 6, Column 2</td>
    </tr>
</table>

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

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

This Pen is owned by coding clone on CodePen.

See more by @coding-clone on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.