Как использовать несколько амперсандов для элемента привязки?

Question

scss

a {
  text-decoration: none;
  &:active {
  color: $color-secondary;
  }
  &:visited {
    color: $color-primary;
  }
  &:hover {
  color: $color-accent;
  }
}

css

a:active {
  color: #E4E4E4;
}


a:visited {
  color: #333;
}


a:hover {
  color: #6DB48B;
}

Скомпилированный CSS учитывает только последнее свойство.Как использовать несколько амперсандов для элемента привязки?

Answer 1

Стили :active не отображаются, потому что они переопределяются стилями, которые отображаются ниже в вашем Sass.Чтобы это исправить, измените порядок Sass в следующем порядке:

1. :visited
2. :hover
3. :active