让背景图像“拉伸以适应”我的页面背景

时间:2012-03-11 08:19:30

标签: html css background background-image

我有一个想用作背景图像的图像,但我需要将它的高度拉伸到从页眉到页脚的100%,然后我可以删除背景颜色:黑色;它背后是为了让它变得完美。

有没有办法做到这一点?目前我正在尝试使用这个CSS:

#wrapper .bg{
    background: url(../images/sky.png) no-repeat; 
    position:absolute; 
    top:0;
    left:0;
    width:100%; 
    height:100%;
    display:block;
    z-index:-1;
}

这最终会在图像和页脚之间留下一些空间,这与我猜测的数量相同,好像图像不在那里。

2 个答案:

答案 0 :(得分:11)

如果您不支持旧浏览器,可以使用css3来实现此目的。

body {
  background-image: url(myimage.png);
  background-size: cover;
}

答案 1 :(得分:2)

不,你需要做的是在身体内添加一个图像标签,并将高度设置为100%。使用CSS应用任何z-index调整,使其保留在您的内容之后。