设置第一列的替代行颜色

Question

我有一张桌子，上面有一些数据。该表的第一列设置为粘性。现在我想要的是仅在第一列中每行的替代颜色。

这是我目前正在使用的表。

<div class="table-responsive">
    <table class="table table-bordered table-striped">
        <thead>
            <tr>
                <th colspan="1"></th>
                <th colspan="4"></th>
                <th colspan="3" style="text-align: center">%Penetration</th>
            </tr>
            <tr>
                <th scope="col">Action</th>
                <th scope="col" *ngFor="let tableHeader of this.tableHeaders">
                    {{ tableHeader }}
                </th>
            </tr>
        </thead>
    <tbody>

th:first-child,
td:first-child {
    margin-left: -1px;
    position: sticky;
    left: -1px;

}

td:first-child {
    background-color: white;
}

我尝试过

td:first-child > td:nth-child(even){
    background-color: blue;
}

Answer 1

尝试一下

tr:nth-child(even) > td:first-child {
    background-color: blue;
}

这是示例https://codepen.io/anon/pen/QRLVoY

Answer 2

您可以尝试以下方法：

tr:nth-child(odd)>td:nth-child(1) {
            background: red;
        }

输出为