Html 更改字体'；带悬停的s图标颜色

我刚开始编程，我需要一些帮助

我使用的字体图标很棒，我试图改变它的颜色时，悬停，但不知道为什么它不工作。我在这里查找了其他有同样问题的人，尝试了他们的解决方案，但仍然不起作用：(

以下是我的HTML代码的一部分：

        <footer>
        <div class="row container">
            <div class="logo-rodape col-md-2">
                <img src="img/logo-principal-white-gota.png" alt="Logo Picada Zero">
            </div>

            <div class="r-content col-md-4">
                <p class="slogan-title">CLEAN AND PROTECTION</p>
                <p class="slogan-sub">Proteção e limpeza para sua família</p>
            </div>

            <div class="r-social col-md-5">
                <a href="www.facebook.com"><i class="fa fa-facebook fa-2x" aria-hidden="true" style="color:#fff"></i></a>

                <a href="www.vimeo.com"><i class="fa fa-vimeo fa-2x" aria-hidden="true" style="color:#fff"></i></a>
            </div>
        </div>

    </footer>

我真的很高兴有任何建议，到目前为止，我尝试了我所知道的一切，但都做不好

---

谢谢！

因为它在锚定标记中，所以您应该使用锚定标记在hover上编写CSS。

a:hover.fa facebook{color:#57cdf7}

您可以使用它并在浏览器上进行检查 例如：

i.fa.fa-facebook.fa-2x:hover {
color: red;
background-color: red;
}

---

看起来这是因为您使用了内联样式。它总是具有更高的优先级。此外，您还试图在

标记悬停时更改样式，但您应该使用

---

这对我有用…谢谢伙计。

你检查过你的浏览器控制台吗？Ant错误，比如找不到文件404，我们正在设计一个

，而不是真正的锚标记。我想说最好给

标记分配一个类

a:hover

，但它不起作用，控制台也没有显示错误…还尝试了分配将一个类添加到我的

标记中，比如

so

.facebook图标：hover{color:#57cdf7}

但什么都没有：/a:hover.far，a:hover.fas{color:white；}li a.far，li a.fas{color:red；}你可以使用它并正确工作a i.fa-facebook:hover{color:red！重要；}非常感谢！现在它可以工作了，耶！你能解释一下！重要元素做了什么吗？当元素有另一种颜色的css，你为它添加了新的颜色代码时，不起作用。！重要的意思是过度信任当浏览器执行时，请原谅我的英语-我不能正确地写英语我以前尝试过在我的

标记中添加一个类，但它没有正常工作y、 因此，我认为您对内联样式的看法是正确的。尽管如此，如果我删除内联样式，我将如何使其与其他元素保持对齐？（无论如何，非常感谢您的解释！）您是对的。这似乎是fontawesome图标的问题。当颜色为内联时，引导图示符图标可以悬停。

i.fa.fa-facebook.fa-2x:hover {
color: red;
background-color: red;
}

/* hover state */
 a:hover .far,  a:hover .fas {
    color:white;
 }

/* normal state */
li a  .far , li a .fas  {
  color:red;   
}