img的行为像一个背景img?

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

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

我希望它的行为就好像它是身体背景图像虽然..

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

即中心没有浏览器看到它,所以没有滚动条,如果它更广泛的浏览器等?

这可能吗?


是的,这是可能的,你可能需要做这样的事情:

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>

position: fixed; z-index: -5000 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/


正确的使用方法是:

  body { background-image:url(image.png) no-repeat center top;}
链接地址: http://www.djcxy.com/p/75801.html

上一篇: img behaving like a background img?

下一篇: Scrollbar resizing the page