таблица из блоков, полосатая зебра

Как сделать средством css? чтобы таблица была полосатая, первая строка черная из 6 блоков, вторая белая из 6 блоков и так далее.

 <div class="table">
 <div class="row">1</div>
<div class="row">2</div>
<div class="row">3</div>
<div class="row">4</div>
<div class="row">5</div>
<div class="row">6</div>
</div>

Ответы (1 шт):

Автор решения: Fruit

Чётные строки

.table .row:nth-child(even){
    background: #F7F7F7;
}

Нечетные строки

.table .row:nth-child(odd){
    background: #fff;
}

Можно добавить стиль по порядковому номеру строк таблицы: Строки 1,4,6...

.table .row:nth-child(3n+1){
    background: #f2fff5;
}

Строки 2,5,8...

.table .row:nth-child(3n+2){
    background: #ffeaea;
}

Строки 3,6,9...

.table .row:nth-child(3n+3){
    background: #eeecff;
}

Как лучше и проще создавать таблицы, статья.

→ Ссылка