图标上没有背景颜色 link

Question

我正在使用 AdminLTE 3 主题，字体很棒的图标作为操作链接：

<a href="/products/2/edit"><i class="fas fa-edit"></i></a>

渲染后的页面看起来不错，图标背景是透明的。当我将鼠标悬停在图标上时，图标周围出现黑色背景。

如何去除这个黑色背景？

我试过了，但没有任何反应：

i, a :hover{
    background: none;
}

Answer 1

我的猜测是所有链接的一些样式规则覆盖了这个。也许试试这个：

i:hover, a:hover {
    background: transparent!important; // or background-color
}

Answer 2

试试这个

a i{
  padding:10px;
  background:#fcf;
}
a:hover,i:hover{
  
  background:transparent;
  /* or */
  /* background:none;*/
}

<script src='https://kit.fontawesome.com/a076d05399.js'></script>
<a href="/products/2/edit"><i class="fas fa-edit"></i></a>

Answer 3

这一个解决了问题：

i:hover, a:hover {
    background: transparent!important; // or background-color
}

谢谢！

No background color on icon link