jQuery Mobile將頁列入頁面中心

我正在創建一個使用jQuery Mobile的應用程序，並且我一直試圖以列表視圖爲中心，但似乎無法做到這一點。我不希望我的名單在頁面頂部開始，但在中心。任何方式在這個？jQuery Mobile將頁列入頁面中心

而且我現在用的是多頁模板，在這裏將其粘貼，方便參考

<body> 

<!-- Start of first page --> 
<div data-role="page" id="foo"> 
<div data-role="header"> 
    <h1>Foo</h1> 
</div><!-- /header --> 

<div data-role="content"> 
    <p>I'm first in the source order so I'm shown as the page.</p>  
    <p>View internal page called <a href="#bar">bar</a></p> 
</div><!-- /content --> 

<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div><!-- /footer --> 
</div><!-- /page --> 


<!-- Start of second page --> 
<div data-role="page" id="bar"> 
<div data-role="header"> 
    <h1>Bar</h1> 
</div><!-- /header --> 

<div data-role="content"> 
    <p>I'm the second in the source order so I'm hidden when the page loads. I'm just shown if a link that references my ID is beeing clicked.</p>  
    <p><a href="#foo">Back to foo</a></p> 
</div><!-- /content --> 

<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div><!-- /footer -->

來源

2012-03-02 d123

你是什麼意思的名單？你想他們垂直對齊？ – 2012-03-02 21:52:38

jquery mobile，有一個佈局類型列表視圖data-role =「listview」。我希望列表在屏幕的中心開始而不是頂部 – d123 2012-03-02 22:23:30

@ user1053408爲什麼您的示例代碼中沒有任何列表？這是你的實際代碼嗎？ – Jasper 2012-03-02 22:57:40

我不知道你想要什麼100％，但如果你想改變位置一個元素，那麼CSS就是它在：

html, body { 
    height : 100%; 
} 
.ui-mobile .ui-page, .ui-mobile .ui-page .ui-content { 
    height : 100%; 
} 
.ui-mobile .ui-page .ui-content .ui-listview { 
    position : relative; 
    top  : 50%; 
}

這使得頁面ATLEAST一樣大的屏幕，然後將列表視圖控件下來50%。

這裏是一個演示：http://jsfiddle.net/jasper/pr7h2/2/

來源

2012-03-02 22:57:04 Jasper