内容应该从页眉填充到页脚footerin

Question

我正在使用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> 

Answer 1

我做到这一点使用CSS删除从data-role="content" DIV的背景，并应用它，而不是到data-role="page"股利。这是显示在用行动表明一个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 */ 
}