无论显示器的尺寸是多少,如何使背景适合屏幕的整个尺寸?
我遇到的主要问题是我在一个页面上有两个背景。一个在另一个上面,所以第一个上部背景根本没有填满整个屏幕。
这可能与两个背景有关吗?
这是CSS,landing-bg2是上部bg,内容是下部
#content {
background-color: #eb6e1e;
position: relative;
background-position: center top;
background-size: cover;
-webkit-background-size: cover;
height: auto;
padding: 160px 0 120px;
color: #fff;
}
.landing-bg2 {
background: asset-url("write-bg.jpg") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
height: 100%;
width: 100%;
}
答案 0 :(得分:1)
现在浏览器对多个背景的支持非常好,如果你想要两个全尺寸背景图像,你可以在同一个div中声明它们。
继承浏览器支持:http://caniuse.com/#feat=multibackgrounds
语法为:background-image:url(''), url('');
逗号分开。然后,您需要在background-size:
和background-position
声明中保持相同的顺序。