Safari 6 边框在设置边框半径后悬停答案

【问题标题】：Safari 6 border lingering after hover with border radius setSafari 6 边框在设置边框半径后悬停
【发布时间】：2012-08-03 20:52:25
【问题描述】：

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

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

【问题讨论】：

【解决方案1】：

尝试使边界半径值等于锚元素上的填充，看看是否没有帮助。我在 Safari 6 中也遇到了同样的问题，这似乎已经解决了。

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

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

a:hover {
  background: #004184;
}

【讨论】：

【解决方案2】：

刚刚遇到同样的问题，发现使用偶数 (2,4,6,..) 作为半径为我修复了它，如下所示：

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

不管不同的填充值。

【讨论】：

【解决方案3】：

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

【讨论】：