如何使用SASS使用菜单项

我正在创建类名分别为l1、l2的菜单项，并希望为每个项提供不同的背景色。要获得CSS文件中每个项目所需的背景色，我必须这样编写代码：

.menu ul li.l1 {
  background: red;
}
.menu ul li.l2 {
  background: green;
}

.menu {
  some properties
  ul li {
    some properties
    .l1 {
      background: red;
    }
  }
}

在Sass中，我尝试使用嵌套属性并编写如下代码：

.menu ul li.l1 {
  background: red;
}
.menu ul li.l2 {
  background: green;
}

.menu {
  some properties
  ul li {
    some properties
    .l1 {
      background: red;
    }
  }
}

在编写上述代码时，我得到以下CSS作为输出：

.menu ul li .l1 {
  background: red;
}

这不是我想要的背景设置

---

哇，我可以使用SASS访问我的菜单项吗？

您的

。l1

未正确声明

.menu {

  ul li {

    &.l1 {
      background: red;
    }
  }
}

---

必须同意@cimmanon。。。在

.l1

之前的

&

应该可以做到这一点。谢谢这对我有用。