内容应该从标题到页脚填充html页面

时间:2012-08-23 07:58:13

标签: jquery html jquery-mobile

我正在使用jquery mobile。 我创建了一个非常简单的页面,其中有一个固定的页眉和页脚。我在该页面只有两个按钮。页脚固定在底部,因此页面的一半是银色(data-theme = c),一半是灰色(底页)。

无论我想在一个页面上放置多少内容,我希望从页眉到页脚的整页都是银色(根据指定的主题)。 有可能吗?

<div data-role="page" data-theme="b" id="ui-page-start" class="ui-page-active">
    <div data-role="header" data-theme="b" data-backbtn="false">
        </div>

    <div data-role="content" class="ui-content" role="main" style="text-align: center;"data-theme="c"> 
    <br/>
    <div>
        <input type='text' id='jid' placeholder="JID" data-mini="true" value='sobha@ns382290.ovh.net' style="border-radius: 10px;">

        <input type='password' data-mini="true" id='password' placeholder="Password"style="border-radius: 10px;">
        </div>                  

    </div>
    <div data-role="footer" data-position="fixed" class="ui-bar-a fade " role="contentinfo" style=": 212px; ">
        </div>

</div>

1 个答案:

答案 0 :(得分:0)

我使用CSS从data-role="content" div中删除背景,然后将其应用到data-role="page" div。这是一个jsbin显示它在行动:

http://jsbin.com/ijeqiy/2/

您可以使用.ui-body-课程定位各个主题。例如,在您的代码中,您在页面div上使用主题b,因此您可以像这样覆盖它:

.ui-body-b {    
    background: #F9F9F9; /* the background color you want */
}

.ui-content {
    background: none; /* remove the background color from the content because it's not long enough */
}