悬停后，边框半径设置为Safari 6边框

Question

我在页面上有一个典型的链接。在悬停时，链接接收边框颜色和边框半径。在Safari 6中，我注意到当鼠标离开链接时，留下了非常微弱的边框颜色。如果再次悬停在链接上，即使未设置边框颜色，在某些情况下边框也会变暗和变暗。如果未设置border-radius，则不会发生此问题。

我无法在Firefox或Chrome（适用于Mac）中重复此问题。我发现最简单的修复方法是为基本锚点样式指定实心或透明的边框颜色。这可能只是一个Safari渲染错误吗？

呈现问题的链接：http://jsfiddle.net/zafer/msnak/4/

Answer 1

尝试使border-radius值等于anchor元素上的填充，看看是否有帮助。我在Safari 6中也遇到了同样的问题，似乎已经解决了这个问题。

所以你的CSS代码看起来像这样：

a {
  display: inline-block;
  padding: 15px;
  border-radius: 15px;
}

a:hover {
  background: #004184;
}

Answer 2

刚遇到同样的问题，发现使用偶数值（2,4,6，..）作为半径为我修复它，就像这样：

a{
    color: white;
    padding-right: 9px;
    padding-left: 9px;
}
a:hover{
    background-color: green;
    border-radius: 4px;
}

无论填充值如何不同。

Answer 3

后台剪辑解决方案确实为我解决了问题，请查看https://stackoverflow.com/a/3447130/1200097上的详细信息，您的属性可能需要重新排序。