Как чередовать цвета фона в строках сетки? ⇐ Html

[Anonymous]

Я создаю что-то похожее на это


поэтому я хочу добиться этого (шахматного) эффекта, при котором последний элемент строки сетки содержит тот же цвет фона, что и цвет фона первого элемента второй строки
Я создаю контейнер с помощью сетки и помещаю в него несколько карточек. Можно ли это сделать с помощью CSS?

Код: Выделить всё

.cards-container {
display: grid;
grid-template-columns: repeat(2, 10rem);
}

.card {
border: 1px solid black;
}

.cards-container > a:nth-child(odd) {
background-color: #4268af;
}

Код: Выделить всё

[h4]name[/h4]


[h4]name[/h4]


[h4]name[/h4]


[h4]name[/h4]


[h4]name[/h4]


[h4]name[/h4]

Подробнее здесь: https://stackoverflow.com/questions/731 ... -grid-rows