Question

如何避免IE 10在点击它们时应用于锚点的恼人的灰色背景？

Answer 1

实际上有一个非常简单的CSS修复。当IE 10处于:active状态时，IE 10会更改background-color个锚标签。要阻止它发生或更改颜色，您可以使用下面的CSS规则。

a:active{
    background-color: transparent; /* Can be any colour, not just transparent */
}

现场演示：http://jsfiddle.net/tw16/NtjK7/

在旁注中，值得一提的是，在样式链接时，您需要确保以正确的顺序编写规则，以确保不会覆盖以前的样式：

a:link{}    /* 1st */
a:visited{} /* 2nd */
a:hover{}   /* 3rd */
a:active{}  /* 4th */

Answer 2

我发现它实际上是：焦点增加了灰色背景。

这对我有用：

a:focus {
    background-color: transparent;
}

Answer 3

我找不到很多信息，但我确实发现了一个问题：

在span

中包装锚文本

Working Solution

如果您不想更改HTML中的每个锚点，可以使用如下脚本：

$("a:not(.dont-use-span)").each(function() {
    $(this).html("<span>" + $(this).html() + "</span>");
});

Working solution

注意：只需将类dont-use-span添加到您不想修改的锚点

Answer 4

经过许多不切实际的测试后，我终于使用了它：

  a               {color:#fff; background-color:#f77927 !important;}
  a:hover         {color:#fff; background-color:#e65e06 !important;}
  a.active        {color:#fff; background-color:#e65e06 !important;}
  a.focus         {color:#fff; background-color:#e65e06 !important;}

See in action

避免IE 10锚点/链接上的灰色背景

4 个答案: