我在页面上有一个物理图像..
<img src="image.png" alt="image-name" />
我希望它表现得好像它是身体背景图像但是..
body{
background: url(image.png) no-repeat center top;
}
即没有浏览器看到它居中,所以如果浏览器更宽,那么没有滚动条?
这可能吗?
答案 0 :(得分: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>
答案 1 :(得分:1)
position: fixed; z-index: -5000
你想要的是什么?
position: fixed
都会使图片始终固定在浏览器的某个位置。
z-index: -5000
只需将图片置于一切
为了使它居中,我认为您需要事先了解图像的大小。如果您这样做,请添加
top: 50%;
left: 50%;
margin-top: -100px;
margin-left: -250px;
其中100是图像高度的一半,250是图像宽度的一半。取自Center a position:fixed element
答案 2 :(得分:-1)
使用它的正确方法是:
body { background-image:url(image.png) no-repeat center top;}