html - 不透明悬停效果在 IE 中无法正常工作

Question

我有这个简单的悬停效果http://www.mysecretathens.gr/Sera/index.html

#footer ul li:hover {
opacity: 0.7;
filter: alpha(opacity=40);
 }

在页脚下方的社交媒体图标中，但在 IE 中，我看到每个图标周围都有一个蓝色边框。如何解决？你也看到这个吗？

Answer 1

我没有看到它，但我想它们是<a>锚标签。因此，对于 IE，您必须添加border:0px;作为您的社交媒体图标的锚标签。

Answer 2

如果您在图像周围有一个链接，IE 会自动在其周围放置一个边框。

删除蓝色边框添加a { border: 0 }到您的 CSS

Answer 3

将此添加到您的CSS：

-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";

编辑：之前添加filter: alpha(opacity=40);

Answer 4

如果你有一个链接（锚），它是 Internet Explorer 的标准。在这种情况下，您必须使用以下命令重置边框：

a { 
  border :none;
}  

或者

a { 
  border :0px;
}  

下次，我建议您使用jsfiddle，您可以在其中轻松地放置您的代码以在站点上运行和调试它以解决问题。