Sass Scss父选择器，悬停并处于活动状态

我对Scss非常陌生，我试图有一些逻辑，当我在a元素上悬停时，我会出现一个基础条，如果我在导航菜单中选择该元素，该条将保持固定

我有以下内容，但我似乎没有正确嵌套活动操作：

nav {
  max-width:100%;
  background:  lightblue;
  ul{
    background: yellow;
    li {
      background: yellow;
      text-align: center;
      a {
        color: red;
        display: inline-block;
      }
        &:hover { background: linear-gradient(to top, green 4px, transparent 0); }
        &:active { background: linear-gradient(to top, green 4px, transparent 0); }
    }
  }
}

这就是我在a元素上正确使用hover和active的方式吗？你能帮忙吗？我对此相当困惑

谢谢,

---

p.

您的

：悬停

和

：活动

选择器与li

元素

相关。您应该将这些规则放到

部分

nav {
  max-width:100%;
  background: lightblue;

  ul{
    background: yellow;

    li {
      background: yellow;
      text-align: center;

      a { // <a> starts here
        color: red;
        display: inline-block;

        &:hover { 
          background: linear-gradient(to top, green 4px, transparent 0); 
        }

        &:active { 
          background: linear-gradient(to top, green 4px, transparent 0); 
        }
      } // and ends here
    }
  }
}

nav{
最大宽度：100%；
背景：浅蓝色；
保险商实验室{
背景：黄色；
李{
背景：黄色；
文本对齐：居中；
一个{//从这里开始
颜色：红色；
显示：内联块；
&：悬停{
背景：线性渐变（至顶部，绿色4px，透明0）；
}
&：活动{
背景：线性渐变（至顶部，绿色4px，透明0）；
}
}//到此为止
}
}
}
发布html文档如果您的
:hover
和
:active
样式相同，您可以使用
&:hover，&:active{…}