穿越第4倍后更改div颜色

我有一个scss文件,当它的奇数或偶数时使用nth-child更改颜色。

.e-schedule .e-timeline-month-view .e-work-cells {
  border-bottom: 0px solid $midnight-blue !important;
  &.border-custom {
    border-bottom: 2px solid $midnight-blue !important;
  }
  &:nth-child(odd) {
    background: $bg-gray;
  }
  &:nth-child(even) {
    background: $white;
    &:hover {
      background: $white; // may remove after event CRUD ops
    }
  }
}

我需要的是在4倍(4、8、12 ...)之后更改背景颜色

1,2,3,4-白色

5,6,7,8-灰色

9,10,11,12-白色

13,14,15,16-灰色

...等等

像上面的东西。有人可以帮忙吗?他们有办法使用nth-child吗?还是我需要其他东西。我正在使用Reactjs + SCSS。

注意:由于我正在使用第三方库,因此无法更改div结构。我只能覆盖样式。

评论
喵先生
喵先生

您可以将4个div包装在一个父div中。

并基于备用父div应用CSS。

点赞
评论