在SASS我想改变每一行项目的背景颜色

Question

在SASS中，我想改变每一行项目的背景颜色。

这是我的HTML显示一行3个项目的网格视图

<ul>
 <li><li> <li><li> <li><li>
 <li><li> <li><li> <li><li>
 <li><li> <li><li> <li><li>
 <li><li> <li><li> <li><li>
</ul>

这是我的SASS尝试：

.ul {
  li {
    background: $white;

    &:nth-child(3) {
        background: red;
    }
  }
}

问题：以上示例仅执行第三项。

我想要的结果：

每行有3个li 我希望每一行的第二行都有一个红色的背景颜色。 我可以在：nth-​​child 上做一些数学计算，以便在SASS中实现这一目标吗？

Answer 1

这个有效：

ul {
  li {
    background: white;

        &:nth-child(6n-2), &:nth-child(6n-1),&:nth-child(6n) {
        background: red;
    }
  }
}

另请注意，您有.ul而不是ul