字体真棒图标悬停效果不起作用

Question

开发网站并使用几个字体真棒图标。当用户悬停在一个上面时，需要能够改变它们的颜色。

这是我的css让它们在悬停时改变颜色

.icon:hover {
  color: blue;
}

以下是创建图标的位置请忽略缺少i标签，格式在此论坛上有问题

<i id="mod_squad" class="x-icon icon x-icon-angle-right" style="text-align: center; color: rgb(25, 25, 25); font-size: 25px;" data-x-icon="&#xf105;" aria-hidden="true"></i>

他们根本不会改变颜色。有趣的是，我可以取代＆＃34; color＆＃34;用＆＃34;背景色＆＃34;并且背景颜色会变好。

请用我的无能帮助我，我必须错过一些超级简单的东西。

Answer 1

问题来自于内联CSS样式始终优先于外部CSS样式。

一个简单的解决方法是在要在CSS中覆盖的属性之后添加$count = $sth->fetchColumn(); ：

＆＃13;

＆＃13;

!important

＆＃13;

.test:hover {
  color: blue !important;
}

＆＃13;

＆＃13;

＆＃13;

重要：这不是推荐的方法，但我强烈建议您将内联CSS移到外部CSS样式中。