Ändern Sie die Farbe, wenn Sie den Mauszeiger über ein fantastisches Symbol für eine Schrift bewegen?

Base in der Schriftart AwesomeDokumentatio Ich erstelle dieses Icon:

<span class="fa-stack fa-5x">
  <i class="fa fa-circle fa-stack-2x"></i>
  <i class="fa fa-flag fa-stack-1x fa-inverse"></i>
</span>

Dieser Code erstellt diesen HTML-Code:

<span class="fa-stack fa-5x">
  <i class="fa fa-circle fa-stack-2x">::before</i>
  <i class="fa fa-flag fa-stack-1x fa-inverse">::before</i>
</span>

Es ist ein gestapeltes Flaggensymbol. Ich möchte die Symbolfarbe beim Hover-Ereignis ändern. Ich habe Folgendes versucht:

.fa-stack:hover{
color: red
}
.fa-stack i:hover{
color: red
}
.fa-stack i before:hover{
color: red
}

aber nicht funktioniert.

Antworten auf die Frage(1)

Ihre Antwort auf die Frage