Css 更改背景定位区域

我使用的是CSS3包含值。这似乎是我想要的，因为它会随着窗口的大小调整背景图像。但是，背景查看/定位区域仅允许调整图像的大小。 封面可以工作，但当窗口调整到非常大的位置时，并非所有图像都可见。请看这里：

我希望背景图像至少占据包含内容的所有区域（页眉、内容、页脚区域）。 这似乎是需要解决的问题：“以包含在或覆盖背景定位区域内的最大尺寸渲染图像，保持其固有比例”。

---

背景定位区域是如何改变的？

有一种方法可以使用img元素将图像放在文本后面，在我的jsfiddle中，代码的第一段是图像放在文本后面，而不是使用背景代码

第二个是使用CSS。这将需要一些额外的css编码，但这只是一种可能性，你可以做什么。同样，这可能不是你的答案，而是你能做什么的想法

}

}

}

---

}

并非所有图像都可见，因为很明显，图像的尺寸几乎是方形的，但当您将浏览器调整为全屏时，通常屏幕比高屏幕宽很多

我猜你不希望在这个特定的图像中被剪掉的是蒲公英。一个简单的修复方法是将其定位，使其固定在屏幕底部，并允许顶部被切断

body {
   background:url('images/bg.jpg') no-repeat center bottom fixed;
   background-size: cover;
}

---

还有更多关于整页背景图像技术的讨论，包括使其在MSIE中工作的代码，

这实际上可能在其他地方派上用场，谢谢Cam。Ghoppe给出了正确的答案，但它在ie9以下的任何地方都不起作用（bleh to IE）。希望有帮助。完美的解决方案！定位区域发出了危险信号，但我认为我把问题复杂化了。提醒我要保持简单。

#l1 {
overflow: hidden;

#l1 p{
width: auto;
max-height: auto;
height: auto;
overflow: hidden;
z-index: 2;
position: relative;
color: #fff;

#l1 img {
position: absolute;
width: 100%;
height: auto;
z-index: 1;

#l2 {
position: absolute;
top: 40em;
background: url(http://stylegerms.com/wp-content/uploads/2013/06/Techno-Desktop-backgrounds-Desktop-Wallpaper.jpg) no-repeat;

body {
   background:url('images/bg.jpg') no-repeat center bottom fixed;
   background-size: cover;
}