jQuery Mobile是一种基于HTML5的移动响应式开源框架，它可以帮助开发者快速地创建移动应用。在这篇文章中，我们将介绍如何使用jQuery Mobile创建一个简单的通讯录应用。

<div data-role="page">
<div data-role="header">
<h1>通讯录</h1>
</div>
<div data-role="content">
<ul data-role="listview" data-inset="true">
<li>
<a href="#">
<img src="img/avatar.jpg" alt="头像">
<h2>张三</h2>
<p>13777777777</p>
</a>
</li>
<li>
<a href="#">
<img src="img/avatar2.jpg" alt="头像">
<h2>李四</h2>
<p>13888888888</p>
</a>
</li>
<li>
<a href="#">
<img src="img/avatar3.jpg" alt="头像">
<h2>王五</h2>
<p>13999999999</p>
</a>
</li>
</ul>
</div>
<div data-role="footer" data-position="fixed">
<h4>版权所有 © 2021 - jQuery Mobile</h4>
</div>
</div>

以上代码展示了一个包含三个联系人的通讯录列表。在代码中，我们使用了

标签来创建一个列表，然后使用
• 标签来创建每个联系人的项目。图片、姓名和电话号码都使用了

  和

  标签进行排版。我们还使用了标签来创建可点击的超链接，使用户能够点击进入每个联系人的个人详情页面。

  在最后，我们还添加了一个固定位置的页脚，用于显示版权信息。这里使用了data-role="footer"属性来定义页脚，并使用data-position="fixed"属性来固定页脚在底部。

  总之，使用jQuery Mobile创建一个移动应用非常容易。借助该框架的丰富组件和响应式设计，您可以以更高效的方式创建出符合移动设备的应用。