0

我一直在开发一个简单的角度导航应用程序。我已经了解了 ui-sref-active 和 ui-sref 的概念。根据我的理解，如果分配给元素的 ui-sref 具有分配给其父元素的 ui-sref-active，则可以设置 ui-sref-active 的样式。我在这里尝试了一个 plunker：http://plnkr.co/edit/EhOxCw8EeQhS5uTCQBR0?p= preview

参考上面的链接，我想实现以下目标：

  1. 当我悬停时，聚焦或单击任何这些选项卡（li 标签/父标签）。选项卡的背景颜色、图标和文本颜色应更改。当悬停或聚焦时，更改工作正常。但是当我选择选项卡时，不会反映更改（我想通过更改背景颜色和样式图标和文本来突出显示活动选项卡）。我该如何完成这项工作。

  2. 我想要更少的代码而不是 css。这是我能想出的代码。它适用于悬停和聚焦。不适用于选定的选项卡或选定的活动选项卡。请帮忙

    李{

     padding: 28px 5px 8px 0px;
 background: yellow
 .fa {
  font-size: 35px;
  color: blue
  }
  p {
      font-size: 18px;
     color: blue
  }
  a {
      text-decoration: none;
 }
  &:hover,
  &:focus,
  &:active {
       background-color: green;
      .fa {
          color: #fff;
      }
      p {
           color: #fff;
      }
      a {
          text-decoration: none;
      }
  }

    }

4

0 回答 0