Firefox CSS悬停错误

我有一个网站使用响应式图像地图，并且由于此响应式图像地图而导致跨浏览器翻转效果非常具有挑战性。我终于想出了一个适用于Chrome和Safari的解决方案，但奇怪的不是Firefox。Firefox CSS悬停错误

area.band-hover-1 { 
    z-index: 999999; 
    background-repeat: no-repeat; 
    display: block; 
    content: " "; 
    position: absolute; 
    top: 99px; 
    left: 300px; 
    height: 100px; 
    width: 109px; 
    background-size: contain; 
} 
area.band-hover-1:hover { 
    background-image: url(../img/band-hover-1.png); 
}

的CSS是在Firefox中被应用，我可以看到它在开发工具引用图像（.band悬停-1：悬停），但翻转图像不会在Firefox和谷歌的研究小时后出我只是无法弄清楚是什么问题。

有谁知道为什么这不工作在Firefox？它必须与CSS相关，对吗？

非常感谢您的提前！

来源

2017-06-15 user436421

在此处发布相关代码，而不仅仅是作为链接到现场网站，这可能会在未来发生变化。这个问题需要多年的相关。 – Barmar

请在此处添加有意义的代码和问题描述。请不要链接到需要修复的网站 - 否则，一旦问题得到解决，或者您链接到的网站无法访问，此问题将对未来的访问者失去任何价值。发布 [最小，完整和可验证示例（MCVE）]（https://stackoverflow.com/help/mcve）演示您的问题将帮助您获得更好的答案。欲了解更多信息，请参阅 [我网站上的某些内容不起作用。我可以直接粘贴一个链接吗？]（https://meta.stackexchange.com/questions/125997/）谢谢！ – j08691

好的，谢谢我道歉我重新提出了这个问题，并阅读了你的指导方针。感谢您的耐心等待。 – user436421

有人有类似的问题。它在css中使用了更具体的选择器来解决。.class:hover not working in firefox?

来源

2017-06-15 22:07:38

谢谢我早些时候尝试过该线程，并将区域标记添加到选择器上并未解决问题。 – user436421

我解决了Firefox不喜欢悬停区域上的代码。我创建了一个包装div，解决了这个问题。 – user436421

Firefox CSS悬停错误

回答

相关问题