Question

我尝试使用CSS3背景大小制作适合页面高度的背景，但它仅适用于宽度，但不适用于高度。

我打算让这个背景图片适合100％页面的宽度和高度，即使在打破它的比例时，我也没有看到问题，因为我使用的是背景尺寸：100％100％;和

The percentage is relative to the width or height of the area given by 'background-origin'

（background-origin的任何值都不会改变）

我需要一些提示，为什么我不能使背景高度适合<body>？我怎么能这样做？

这是我的css的一部分：

html {
    height:100%;
    min-height:100%;
}
body {
    min-height:100%;
    margin:0;
    padding:0 2em;
    background:#474747 url(../images/bg.jpg) 100% 0 no-repeat;
    background-size:100% 100%; /* raaaaaah */
    font-family:Cambria,serif;
    min-width:910px;
    position:relative;
}

提前致谢！

编辑：您可以在http://matthecat.com/v2/blog.html

上进行测试

Answer 1

我认为你过于复杂。我不知道所有其他css代码是什么。我不认为有些人甚至做任何事情。

body {
    background:#474747 url(http://www.cssplay.co.uk/layouts/rabbit.jpg);
    background-size:100% 100%;
}

这段代码非常适合我。

我不确定你为什么要这么做。有更好的方法来设置页面的背景。您可以使用background-repeat:repeat-y为bg切片填充顶部，并使用混合为bg颜色的渐变图像（＃474747）。或者如果它是纹理，你可以完全重复。您尝试使用哪种图像？

Answer 2

查看此页面中的来源... http://www.cssplay.co.uk/layouts/background.html

background-size不适合元素

2 个答案: