chrome和safari中的css悬停问题

【问题标题】：css Hover problem in chrome and safarichrome和safari中的css悬停问题
【发布时间】：2016-09-27 18:25:38
【问题描述】：

这是有问题的网站

顶部菜单将在鼠标悬停时改变其颜色。除 chrome 和 Safari 之外的所有浏览器。它是一个Webkit错误。如果是这样，我该如何解决？

【问题讨论】：

【解决方案1】：

我发现在 <a> 上设置 display:block 有效。我不推荐 li:hover 因为它在 IE6 中不起作用

【讨论】：

【解决方案2】：

看起来像 webkit 悬停行为。

改变/选择器来自

.menu_center ul li a:hover

到

.menu_center ul li:hover a

或者两者结合：

.menu_center ul li a:hover,
.menu_center ul li:hover a 
{ .... }

为我工作。

【讨论】：

【解决方案3】：

我发现添加 href="#" 可以作为临时修复。似乎这是最近的发展。

【讨论】：

【解决方案4】：

通常最好的解决方法是在 Safari 中具有过渡的元素上添加 -webkit-transform: translate3d(0,0,0)。我遇到了同样的问题并修复它Hover bugs with :before On Safari

【讨论】：