在jQM中，为Page设置全屏CSS图像背景的正确/正确/实际方法是什么？

Question

经过长时间的jQM项目工作，功能几乎完成。 现在在UI上工作。 当我尝试为jQM Page设置全封面CSS图像背景时，它要么无法正常工作。

我在这个问题上google / stackoverflow很多。 令我惊讶的是，没有官方文档可以直接/简单地解决此问题。

许多建议仅对某些人有用，而对其他人则不行（即使是所有受支持的浏览器）。 对我来说，起初我无法获得100％的高度，然后在经过google和其他程序员的帮助之后，我可以获得100％的高度，但是现在它在过渡前后的反弹背景。

这个帖子的问题是，有没有正确的方法/正确的方法来设置没有所有问题的jQM页面背景图像的正式方法？

我确信这种正确/正确/实际的方式可以帮助许多其他开发人员并从中受益。

请指教，谢谢。

Answer 1

工作示例： http : //jsfiddle.net/Gajotres/vds2U/51/

内容背景图片

HTML

<div data-role="page" id="index" data-theme="a" >
    <div data-role="header">
        <h3>
            First Page
        </h3>
        <a href="#second" class="ui-btn-right">Next</a>
    </div>

    <div data-role="content" id="content">

    </div>

    <div data-role="footer" data-position="fixed">

    </div>
</div>  

CSS

#content {
    padding: 0;
    position: absolute !important;
    top : 40px !important; 
    right : 0;
    bottom : 0 !important; 
    left : 0 !important;  
    background:url(http://htc-wallpaper.com/wp-content/uploads/2013/11/bulldog-puppy1.jpg);
    background-size:cover;
    background-repeat:no-repeat;    
}

在此处阅读有关此解决方案的更多信息。

页面背景图片

CSS

.ui-page {
    background:url(http://htc-wallpaper.com/wp-content/uploads/2013/11/bulldog-puppy1.jpg);
    background-size:cover;
    background-repeat:no-repeat;    
}