jQuery Mobile 页面设计

现在我们来看下如何使用

jQuery Mobile 框架去设计页面元素。在 jQuery Mobile 框架设

计的

HTML 页中，通常是一个页面中有一个页面容器，而页面容器中则存在多个页面。页

面容器以

date-role=“page”作标识，而普通页面以 date-role=“content”作标识。在一个页面中，

页面头部和尾部是可选的部分。在我们的这个应用中，有两个页面是都有头部和尾部的，一
个页面没有头部和尾部，下面看示例代码：

1

<div data-role="page">  

2

   <div  data-role="header">...</div>     <div  id="contentWithHeaderAndFooter1"  data-

role="content">...</div> 

3

  <div data-role="footer">...</div>  

4

   <div  data-role="header">...</div>     <div  id="contentWithHeaderAndFooter2"  data-