JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr class="a"><td>A</td></tr>
    <tr class="b"><td>B</td></tr>
    <tr class="b"><td>B</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="c"><td>C</td></tr>
    <tr class="d"><td>D</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="b"><td>B</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="c"><td>C</td></tr>
    <tr class="d"><td>D</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="a"><td>A</td></tr>
    <tr class="c"><td>C</td></tr>
    <tr class="d"><td>D</td></tr>
    <tr class="a"><td>A</td></tr>
</table>

CSS

/* 一般的TR就一灰一白 */
tr:nth-child(even) {
    background-color: #CCC;
}

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

/* class a 要換成紅色系 */

/* 用 + 號選取緊鄰的下一個元素 */
/* 偶數列（深色）的下一個 tr.a 一定是單數（淺色） */
tr:nth-child(even) + tr.a {
    background-color: #FCC;
}

/* 奇數列（淺色）的下一個 tr.a 一定是雙數（深色） */
tr:nth-child(odd) + tr.a {
    background-color: #F00;
}

/* 這樣會抓不到第一個 tr.a，所以幫第一個 tr.a 上淺色 */
tr.a:nth-child(1) {
    background-color: #FCC;
}