9

我在页面上有一个物理图像..

<img src="image.png" alt="image-name" />

我希望它表现得好像它是身体背景图像一样..

body{
background: url(image.png) no-repeat center top;
}

即在没有浏览器看到的情况下居中，所以如果浏览器更宽则没有滚动条等？

这可能吗？

4

3 回答 3

3

是的，有可能，你可能不得不做这样的事情：

CSS

#your-image {
    position: absolute;
    z-index:1;
}
#container {
    position: relative;
    z-index: 2;
}

HTML

<body>
    <img id="your-image src="" alt="">
    <div id="container">
        <!-- All your content goes there -->
    </div>
</body>
于 2012-11-16T12:39:54.033 回答
1

是position: fixed; z-index: -5000你想要的吗？

position: fixed无论内容如何，​​使图像始终固定在浏览器上的某个位置。

z-index: -5000只是把图像放在一切后面

为了使其居中，我认为您需要事先知道图像的大小。如果你这样做，添加

top: 50%; 
left: 50%;
margin-top: -100px;
margin-left: -250px;

其中 100 是图像高度的一半，而 250 是图像宽度的一半。取自 中心位置：固定元素

演示：http: //jsfiddle.net/SPsRd/1/

于 2012-11-16T12:36:43.170 回答
-1

正确的使用方法是：

  body { background-image:url(image.png) no-repeat center top;}
于 2012-11-16T12:41:07.583 回答