background-size:cover; 属性在手机上设置手机背景图片,为什么手机下面有白色的背景漏出来?

我开发手机网页,手机也要一个背景图片,图片的尺寸是640*960,因为背景图片要是弹性的,要自适应,所以我在body上用了background:url(../images/bg.jpg) no-repeat; background-size:cover;这2个属性,一个是定义背景图片,一个是设置自适应,但是现在宽度是自适应了,为什么高度在手机的下方会有一条白色的,好像是图片高度不够一样,

请问,如何让图片全部盖住手机屏幕?

阅读 7.4k
8 个回答

background-size: 100% 100%

display:inline-block

body{margin:0;padding:0;background-size:100% 100%}

chrome浏览器开发者工具,用响应式模式调试一下,看是什么原因

新手上路,请多包涵

这个是不是得媒体查询屏幕高度,比如iphone5,height:568px;iphone6高度627px;调节,我以前用这个办法解决了图片高度不够的问题

background-size:cover;
自适应保持了高宽比 如果要铺满 考虑让背景图片拉伸填满

手册上写着cover是填满背景的最小适配,contain是填满背景的最大适配,你看看是不是这个原因。

body{

min-height: xx px;

}
定下最小高度,以免出现下面白色一条线。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题