几天来我一直在尝试创建这个，但没有 100% 的工作结果。我想为我的网站制作 5 个锚定图像翻转（用于导航菜单）。我现在一定已经读过十几个教程了。他们中的一些人推荐我使用 js，其他人推荐我使用 css。所有这些都产生了大部分问题。最普遍的问题是，当我进行功能性图像翻转并使用 css 定位它时，当我调整浏览器大小时，它不会与其余图像（具有“粘到背景”效果）成比例地转换其位置窗户。基本上我希望所有图像（包括翻转）都具有“粘在背景上”的效果。
我现在拥有的是最接近预期效果的东西。在 Firefox 中，只有当鼠标悬停在图像的顶部 25% 并且“粘在背景上”效果不起作用时，翻转才有效。在 chrome 中，锚定的翻转图像可以正常工作，但“粘在背景上”的效果也不起作用。这是代码：
#news {
position:relative;
left:180px;
bottom:450px;
width:210px;
height:67px;
}
<div id="news" align="center">
<a href="news.html"
onmouseover="document.news.src='newsRO.png'"
onmouseout="document.news.src='news.png'">
<img src="news.png" name="news" width="210px" height="67"/>
</a>
</div>
这是一个现场示例的链接：http ://www.scissormanmusic.com/index_new2.html 显然，我仍然需要对网站上的其他一些元素进行大量定位和内容开发。但是一旦我可以使菜单正常运行，我应该能够将它们放在正确的位置...我想
请。任何见解将不胜感激。谢谢你！！