如何切换表/网格中行的颜色?

Jun*_*nZe 1 css css3

有没有办法在CSS或CSS3中切换表/网格中行的颜色?

<table>
    <thead>
        <tr>
            <td>Name</td>
            <td>Votes</td>
        </tr>
    </thead>
    <tbody class="rows">
        <tr>
            <td>Barack Obama</td>
            <td>50%</td>
        </tr>
        <tr>
            <td>Mitt Romney</td>
            <td>48%</td>
        </tr>
    </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

例如,奇数行是白色,偶数行是蓝色.

.rows tr:odd
{
    background-color: White
}
.rows tr:even
{
    background-color: blue
}

或者那是不可能的?

Mat*_*ele 5

两者:nth-​​of-type和:nth-​​child伪元素都可以.

我喜欢nth-of-type方法:

/* Zebra striping */


  tr:nth-of-type(odd) { 
    background: blue; 
    }

    tr:nth-of-type(even) { 
    background: white; 
    }
Run Code Online (Sandbox Code Playgroud)