悬停时更改按钮内的字体图标颜色

Question

在我的网站（开发中）http://www.stefaanoyen.be的页脚中，文本前有 3 个带有箭头的按钮。箭头是一种图标字体，我希望它在按钮悬停时改变颜色（与按钮文本一样）。

知道如何做到这一点吗？

这是我的 html：

<a class="footerbutton"><span class="footerlist">X</span>Vraag offerte</a>

这是按钮：悬停CSS：

a:hover.footerbutton {
background-color: #B61618;
color: #ddd;
border: none;
text-decoration: none;
}

这是页脚列表 span 类 css：

.footerlist:hover {
color: #ddd;
 }

Answer 1

在悬停时定位按钮内图标颜色的最简单方法是像这样定位它：

.footerButton:hover .footerlist {
   color: #ddd;
}