主页 / 问题 / 862733
Accepted
Александр
Asked:2020-08-01 03:31:21 +0000 UTC2020-08-01 03:31:21 +0000 UTC

每隔第三个和第四个 CSS 元素选择一次

  • 772

我有一列有许多 50% 宽度的块（一行 2 个）。

我需要每 3 和 4 块更改一次颜色。

这是一个例子：

.row {
width: 400px;
display: flex;
flex-wrap: wrap;
}
.row div {
width: 48%;
height: 100px;
border: 1px solid #000;
}

.row div:nth-child(3n) {

}
<div class="row">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>

这是需要通过 nth-child 访问的块的屏幕截图。 在此处输入图像描述

html

1 个回答

  1. Best Answer

    .row {
width: 400px;
display: flex;
flex-wrap: wrap;
}
.row div {
width: 48%;
height: 50px;
border: 1px solid #000;
}

.row div:nth-child(4n+3), .row div:nth-child(4n) {
  background:pink;
}
    <div class="row">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>

    • 3

相关问题