如何设置背景图像大小= 100％或拉伸到完整的<div>背景</div>

Question

我的css代码=

background:url(images/solu_bg.png) no-repeat left top;

但它没有涵盖整个div背景区域。为什么？

Answer 1

以下是some instructions，了解如何执行此操作。

但正如David Dorward在他的回答中所说，这是一个丑陋的黑客。

Answer 2

CSS3有一个名为background-size的属性，你可以使用它（但它并不是所有浏览器都完全支持）：

body {
    background-size: cover;
    -moz-background-size: cover; /* for Firefox */
}

ALA

有更多信息

Answer 3

没有办法（除了可能使用为CSS 3提出的不受广泛支持的东西）来缩放背景图像（并且浏览器在缩放图像方面相当差）。

可以通过在内容后面绝对定位前景（内容）<img>来伪造它，但这只是一个丑陋的黑客（例如，如果没有显示样式表，会有一些令人讨厌的副作用）并且您获得与内容内联的图像。

最好将页面设计为使用单个图像（可以混合为纯色）或重复图像。