jquery mobile在頁面頁腳問題中添加列表視圖

我正在嘗試在下面的page2頁腳中添加一個2選擇列表視圖。我已經修復了頁腳位置，列表視圖和鏈接工作得很好。我的問題是我找不到一種方法來調整列表視圖的大小，而不是通過添加文本來擴展屏幕寬度。頁腳中的列表視圖「按鈕」很小，我想控制它們的寬度。謝謝jquery mobile在頁面頁腳問題中添加列表視圖

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>jQuery Mobile Web App</title> 
<link href="jquery.mobile-1.0a3.min.css" rel="stylesheet" type="text/css"/> 
<script src="jquery-1.5.min.js" type="text/javascript"></script> 
<script src="jquery.mobile-1.0a3.min.js" type="text/javascript"></script> 

<script src="/phonegap.js" type="text/javascript"></script> 
</head> 
<body> 

<div data-role="page" id="page"> 
<div data-role="header"> 
    <h1>Page One</h1> 
</div> 
<div data-role="content"> 
    <ul data-role="listview"> 
     <li><a href="#page2">Page Two</a></li> 
     <li><a href="#page3">Page Three</a></li> 
     <li><a href="#page4">Page Four</a></li> 
    </ul>  
</div> 
<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div> 
</div> 

<div data-role="page" id="page2"> 
<div data-role="header"> 
    <h1>Page Two</h1> 
</div> 
<div data-role="content"> 
    Content  
</div> 
<div data-role="footer" align="center" data-position="fixed" data-theme="c"> 
    <ul data-role="listview" data-theme="b" data-inset="true"> 
    <li><a href="#page">Page One </a></li><br> 
     <li><a href="#page3">Page 3</a></li> 
    </ul> 
</div> 
</div> 

<div data-role="page" id="page3"> 
<div data-role="header"> 
    <h1>Page Three</h1> 
</div> 
<div data-role="content"> 
    Content  
</div> 
<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div> 
</div> 

<div data-role="page" id="page4"> 
<div data-role="header"> 
    <h1>Page Four</h1> 
</div> 
<div data-role="content"> 
    Content  
</div> 
<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div> 
</div> 

</body> 
</html>

來源

2011-09-08 Tom

我最終添加了一個navbar，做了我所需要的。

來源

2011-12-14 16:17:24 Tom

jquery mobile在頁面頁腳問題中添加列表視圖

回答

相關問題