背景图片没有覆盖在平板电脑上

当我在我的平板电脑上访问我的网站时，背景在页脚停止显示之后？当我缩小窗口大小时，它在我的桌面上的行为不像这样。背景图片没有覆盖在平板电脑上

这是网站：http://www3.carleton.ca/clubs/sissa/html5/video.html

CSS：

body{ 
    width: 100%; /*always specify this when using flexBox*/ 
    height:100%; 
    display: -webkit-box; 
    display: -moz-box; 
    display: box; 
    text-align:center; 
    -webkit-box-pack:center; /*way of centering the website*/ 
    -moz-box-pack:center; 
    box-pack:center; 
    background:black; 
    background:url('images/bg/bg14.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover !important; 
    -moz-background-size: cover !important; 
    background-size: cover !important; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 13px; 
}

这是它看起来像我的Nexus 7： enter image description here

当我使用不同的用户代理浏览器它涵盖了整个背景： enter image description here

HTML：

<!--Site Main Body--> 
<div id="wrapper"> 
    <section id="body_div"> 

    </section> 

    <footer id="footer"> 
     &copy; Copyright by SimKessy 
    </footer> 

</div> 
</body> 
</html>

来源

2013-04-05 Batman

不知道这是否会帮助和我没有测试它的可能性，但你可以尝试添加背景属性到html元素，而不是的body元素。

我删除了!important，但如果您需要它，可以将其添加回去。

html { 
    background:black; 
    background:url('images/bg/bg14.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    background-size: cover; 
}

来源

2013-04-05 21:23:20

没有工作。在页脚下我仍然是白色的。 – Batman 2013-04-06 02:20:34

你可以尝试

body { 
    background-size: 100% 100%; 
}

来源

2013-04-05 20:23:21 Vector

我试过这个，但它没有效果 – Batman 2013-04-06 02:20:14

背景图片没有覆盖在平板电脑上

回答

相关问题