我想使一个图像成为网站的完整背景！我知道这听起来很简单,但它只是让我疯狂,它不适合的页面,这是我达到的最后一次尝试！
CSS：
body {
background:url('images/bg_img1.jpg') #A98436 no-repeat left top;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
}
我也使用Twitter Bootstrap,但事情甚至没有,我不能正确的！
任何帮助将不胜感激.
编辑：我没有使用精确的像素,因为我正在尝试做出敏感的移动设计.
我不知道为什么他们下了这个问题！但这是我如何解决它！
html,body {
margin: 0;
padding: 0;
height: 100%;
}
#mybody {
background: url('images/bodybg.jpg') no-repeat center left;
background-size: 100% 100%;
width: 100%;
height: 100%;
height: auto !important;
min-height:100%;
}
#myheader {
background: url('images/headerbg.jpg') no-repeat center left;
background-size: 100% 100%;
width: 100%;
height: 100%;
height: auto !important;
min-height:100%;
}
#myfooter {
background: url('images/footerbg.jpg') no-repeat center left;
background-size: 100% 100%;
width: 100%;
height: 100%;
height: auto !important;
min-height:100%;
}
解决方法
编辑：我创建了一个
DEMO,删除了一些不必要的东西.这样做的好处不在于你的背景图片.
DEMO工作,但没有像以下引用的代码一样广泛测试.
我最近在一个项目上工作,我们需要这个确切的事情.我从我的项目文件发布,所以有些可能是不必要的,因为它是一个写这个的团队成员.
首先设置html和body的属性.
然后,我有一个内部的根div称为背景.
html,body {
margin: 0;
padding: 0;
height: 100%;
}
#background {
background: #000000 url(urlHere) no-repeat bottom left;
background-size: 100% 100%;
width: 100%;
height: 100%;
height: auto !important;
min-height:100%;
}
再一次,我确信是不必要的,但我希望它有所帮助.