SCSS：图标字体和锚标记中的文本

Question

我想在锚标记中使用图标字体和文本，并希望它在悬停时更改颜色。我正在使用scss进行造型。

到目前为止我的代码是：

<span class="sidebar-list"><a href="#"><span class="icon-SpeechBubble">&nbsp;</span>Live Chat</a></span> 

SCSS

.sidebar-list { 
    a { 
     color:#8894a4; 
     font-family:$font-GlobalFamily; 
     font-size:13px 

     &:hover { 
      color:#fff; 
      cursor:pointer; 
      text-decoration:none; 
     } 
    } 
} 

.icon-SpeechBubble:before { 
    content: "\e633"; 
    font-size:13px; 
} 

我facign的问题是，当我将鼠标悬停在文本中的图标字体并不突出。此外，该文本正在挑选一些不是＃8894a4的随机颜色。有没有办法解决它？

感谢，

Answer 1

尝试：

&:hover:before { 
    color: *; 
}