将HTML内容下推到固定背景图片下方
[英]HTML Content pushed down below a fixed background image
问题描述
My page starts (first thing after the <body> tag) with this: 
我的页面以此开始（在<body>标记之后的第一件事）：
<div id="wallpaper" style="width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; z-index: -1;">
<img src="images/black-matte-1650-Lit-Etched.jpg" style="width: 100%; height: 100%;" alt="">
</div>
This works fine on every browser except IE when it is in Compatibility View mode. 在兼容视图模式下，此功能在除IE之外的所有浏览器上均可正常运行。 Even most IE version display this correctly, but only if not in Compatibility View mode. 甚至大多数IE版本都可以正确显示此内容，但前提是不能在“兼容视图”模式下显示。
The content is supposed to "hover" over the background image so that as the page scrolls, the content scrolls, but the background remains stationary. 内容应该“悬停”在背景图像上，以便随着页面滚动，内容也滚动，但是背景保持静止。 Instead, the rest of the page's contents are pushed down to the bottom of the background image, and they render from there. 而是将页面的其余内容下推到背景图像的底部，然后从那里进行渲染。 So, my page appears to be nothing but it's background image, and you have to scroll down to see the page content below it. 因此，我的页面看起来只是背景图像，而您必须向下滚动才能看到其下面的页面内容。
Can anyone explain what is wrong, and how to fix this? 谁能解释出什么问题了，以及如何解决这个问题？
1 个解决方案
解决方案1
2 已采纳 2015-03-25 20:14:17
If you just want a fixed background image, I would not use a div. 如果您只想要固定的背景图像，则不会使用div。 Try this instead... 试试这个...
CSS: CSS：
body{
background:url(images/black-matte-1650-Lit-Etched.jpg) top right no-repeat; background-attachment:fixed;
}
Then remove your wallpaper div and image from the HTML. 然后从HTML删除墙纸div和图像。
Edit: You could also apply that CSS to your div if that div needs a different background than the rest of the page: 编辑：如果该div需要与页面其余部分不同的背景，也可以将该CSS应用于div：
div#wallpaper{
background:url(images/black-matte-1650-Lit-Etched.jpg) top right no-repeat; background-attachment:fixed;
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.