Question

我的页面开始（<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>

当处于兼容性视图模式时，除IE之外的每个浏览器都可以正常工作。即使大多数IE版本也能正确显示，但仅限于兼容性视图模式。

内容应该＆＃34; hover＆＃34;在背景图像上，以便在页面滚动时，内容滚动，但背景保持静止。相反，页面内容的其余部分被下推到背景图像的底部，然后从那里渲染。所以，我的页面似乎只是它的背景图片，你必须向下滚动才能看到它下面的页面内容。

任何人都可以解释什么是错的，以及如何解决这个问题？

Answer 1

如果你只想要一个固定的背景图像，我就不会使用div。试试这个......

<强> CSS：

body{
    background:url(images/black-matte-1650-Lit-Etched.jpg) top right no-repeat; background-attachment:fixed; 
}

然后从HTML中删除壁纸div和图像。

编辑：如果该div需要的背景与页面的其他部分不同，您也可以将CSS应用于div：

div#wallpaper{
    background:url(images/black-matte-1650-Lit-Etched.jpg) top right no-repeat; background-attachment:fixed; 
}

HTML内容被压缩到固定的背景图像下方

1 个答案: