我想用两种颜色的图像作为背景，然后在该背景上方放置 3 张图像。这是我编写的代码:
<div style="position: fixed; z-index:100" height="5px"><img src="http://i44.tinypic.com/257g1nl.jpg" border="0" style="position: fixed; width:100%" ></div>
<div style="position: fixed; z-index:500"><a href="http://www.hopesheffield.org/hope"><img src="http://i40.tinypic.com/70b4wk.jpg" width="435px" border="0" style="position:fixed; left:1050px;top:120px" ></a></div>
<div style="position: fixed; z-index:500"><img src="http://i42.tinypic.com/11k84mu.jpg" border="0" width:"435px" style="position:fixed; left:550px;top:120px"> </div>
<div style="position: fixed; z-index:500"><img src="http://i43.tinypic.com/2sax8nt.png" border="0" width:"535px" style="position:fixed; left:650px; top:550px"></div>
<head>{{ head_content }}
<style type="text/css">
html {
overflow:hidden;
}
</style>
</head>
另外，我不想滚动。目前，它正在 Internet Explorer 上运行，但是当我从 Safari 打开页面时，背景上方的图像发生了移动。有什么想法吗？
这是网页:http://www.hopesheffield.org/
谢谢!!
最佳答案
尝试使用“左”属性的相对值而不是像素数进行定位。
如:left:25%; 和 left:60%; 用于您的图像。
为了在移动设备上获得更流畅的体验，请尽量不要为图像设置固定大小，而是在 css 而不是 html 属性中应用相同的相对值。
如果您的问题仍然存在，您可能还需要考虑使用 css 媒体查询。
关于css - 图片在不同浏览器中的位置，html，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20349030/