css - 更改背景定位区域

Question

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

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

我希望背景图像至少占据所有包含内容的区域(页眉、内容、页脚区域)。 这似乎是需要解决的问题:“呈现图像，保留其固有比例，以包含或覆盖背景定位区域的最大尺寸”。 CSS 背景定位区域如何变化？

Answer 1

并非所有图像都可见，因为很明显，图像的尺寸接近正方形，但当您将浏览器调整为全屏大小时，屏幕通常比高度宽很多。

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

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

有更多关于整页背景图像技术的讨论，包括使其在 MSIE 中也能工作的代码，on css-tricks.com