javascript - 输入字段 - 蓝色焦点突出显示？无法摆脱？

Question

我已经尝试了一切方法来摆脱这个焦点蓝色突出显示，但似乎没有任何效果。

我试过:

input:focus {
   outline: none; 
}

我在这里读到的是正确的解决方案。虽然它不起作用。使用最新的 Chrome/Safari/Firefox，点击聚焦时蓝色突出显示仍然存在。

它在 IE7/IE8 中运行非常有趣。我尝试了一个在堆栈上阅读的 javascript 解决方案，我在其中向输入添加了一个 onclick:blur 方法，但这只是使输入字段不可编辑？

任何解决方案伙计们？如果可能，更喜欢干净的 CSS 解决方案。

Answer 1

只有在没有更具体的情况下，那段 CSS 才会起作用。请记住，css 遵循最具体的优先规则，所以说

input#myid:focus {  /* <--more specific, takes priority */
    outline: blue;
}

input:focus {  /* <--less specific, overridden by above */
    outline: none;
}

您可以使用 !important 强制覆盖，尽管这可能会在以后导致其他问题:

input:focus {
    outline: none !important;
}

当元素悬停时，使用 Firebug 查看元素的计算 CSS。它会告诉您应用于元素的规则来自何处。