Jak kierować na tag przy użyciu nazwy klasy w SCSS [duplikat]

Question

Mam następujący element HTML

<a class="button">Click</a>

W moim pliku .scss mam następujący kod.

.button{
  & a{
    color:red;
    
    &:hover,
    &:visited{
      color:blue;
    }
  }
}

Powyższy kod nie działa.

Próbowałem wyszukiwać terminy takie jak „kierowanie na klasę rodzeństwa przy użyciu css”, ale wyniki pokazują scenariusze podane poniżej.

<a>
  <span class="button">Click</span>
</a>

Jak ustawić kierowanie na atag za pomocą klasy przycisku?

Aktualizacja :

Nie próbuję kierować na element nadrzędny. Muszę wskazać element, który ma określoną klasę.

Answer 1

nazwa tagu, po której następuje nazwa selektora (klasy lub id), na przykład a.class_name, div.class_namelub a#class_name,div#class_name

div.button{  /* tag name followed by selector(class or id) name*/)
  &>a{ /*will select only direct '<a> tags' inside div.button */
    color:red;
    
    &:hover,
    &:visited{
      color:blue;
    }
  }
}


div.button{  /* tag name followed by selector(class or id) name*/)
  & a{ /*will select only all '<a> tags' inside div.button */
    color:red;
    
    &:hover,
    &:visited{
      color:blue;
    }
  }
}

div.button{  /* tag name followed by selector(class or id) name*/)
  & a.link{ /*will select only '<a> tags with classname link' inside div.button */
    color:red;
    
    &:hover,
    &:visited{
      color:blue;
    }
  }
}

<div class="button"><a class="link" href=""></a></div>