Question

我希望有一个CSS div，它有一个背景图像（完整图像大小为950px x 306px），它显示整个背景图像，并根据浏览器大小调整背景图像的大小。

所以CSS div代码应该：

拥有最大宽度为950像素，最大高度为306像素
显示整个背景图像（调整图像大小以填充整个div）
根据封闭div /浏览器宽度的大小自动调整大小（某些定义，如width =“100％”）

有人可以帮忙吗？我是CSS的新手，并且一直在尝试许多不同的方法，但似乎都没有。我真的很感谢你的帮助！

P.S。请不要JQuery：）

Answer 1

body
{
background-image:url('image.gif');
background-size:100% 100%;
}

Answer 2

如果您希望为用户的浏览器调整大小，则必须是动态的。你不能单独使用CSS。
这可能有用：http://imageresizing.net/

Answer 3

你可以这样做。

body{margin:0; 
    padding:0; 
    width:100%; 
    height:100%; 
    overflow:hidden;
}

img#background{position:absolute; 
    z-index:1; 
    width:100%; 
    height:100%;
    top:0; 
    left:0;
}

http://jsfiddle.net/jasongennaro/nTLXA/1/

然后将div置于此之上。

CSS div背景图片帮助

3 个答案: