html - 我可以使用什么CSS来更改单个链接悬停的颜色而不更改其他链接？

目前，HTML如下所示：

    <div class="col-lg-4 text-center">
                <i class="fa fa-envelope-o fa-3x wow bounceIn" data-wow-delay=".1s"></i>
                <p><a class="email" href="mailto:[e-mail]" style="color: #ffffff; hover:#006b33">[e-mail]</a></p>
            </div>

我的CSS看起来像这样：

    .col-lg-4 text-center a.email:hover {
color: #006b33;

}

我不知道自己在做什么错？有什么建议么？

最佳答案

要更改悬停颜色，您必须使用正确的CSS样式进行更改。但是要将其仅应用于一个特殊元素，您需要创建一个特殊类或将其映射到一个id。请注意，您还必须在CSS中声明标准颜色，否则它将不起作用。

按类别：

.email {
  color: #ffffff;
}
.specialColor:hover {
  color: #006b33;
}

<a class="email specialColor" href="#" style="">LINK</a>

按ID：

.email {
  color: #ffffff;
}
#specialColor:hover {
  color: #006b33;
}

<a id="specialColor" class="email" href="#">LINK</a>