リンクを含む各リスト項目のデフォルトのアイコンは "carat-r"（右矢印）です。これを別のアイコンに変更するには、 変更したいリスト項目に data-icon 属性を使用します：
<ul data-role="listview">
<li><a href="#">Default is right arrow</a></li>
<li data-icon="plus"><a href="#">data-icon="plus"</a></li>
<li data-icon="minus"><a href="#">data-icon="minus"</a></li>
<li data-icon="delete"><a href="#">data-icon="delete"</a></li>
<li data-icon="location"><a href="#">data-icon="location"</a></li>
<li data-icon="false"><a href="#">data-icon="false"</a></li>
</ul>
Try it Yourself »data-icon="false" は、アイコンを削除します。
jQuery Mobileボタンアイコンすべての完全なリファレンスについては、jQuery Mobile アイコン・リファレンス をご覧ください。
標準の 16x16px アイコンをリストに追加するには、リンク内に "ui-li-icon" クラスを持つ <img> 要素を追加します：
<ul data-role="listview">
<li><a href="#"><img src="us.png" alt="USA" class="ui-li-icon">USA</a></li>
</ul>
Try it Yourself »16x16px より大きい画像の場合は、リスト項目の中に最初の子要素として（クラス名なしで） <img>要素を追加します。
jQuery Mobile は、自動的に画像を 80x80px にスケールします：
標準の HTML を使用して、リストに情報を入力します：
<ul data-role="listview">
<li>
<a href="#">
<img src="chrome.png">
<h2>Google Chrome</h2>
<p>Google Chrome is a free, open-source web browser. Released in 2008.</p>
</a>
</li>
</ul>
Try it Yourself »縦の分割線で分割リストを作成するには、<li> 要素内に2つのリンクを配置します。
jQuery Mobile は、自動的にリストの右側に 2番目のリンクを右矢印アイコンで配置します。 ユーザがアイコンの上にマウスを移動すると、リンク内のテキストが（有れば）表示されます：
<ul data-role="listview">
<li>
<a href="#"><img src="chrome.png"></a>
<a href="#">Some Text</a>
</li>
</ul>
Try it Yourself »いくつかのページとダイアログを追加して、リンクをより機能的にすることができます：
<ul data-role="listview">
<li>
<a href="#"><img src="chrome.png"></a>
<a href="#download" data-transition="pop" data-icon="gear">Download Browser</a>
</li>
</ul>
<div data-role="page" id="download" data-dialog="true">
Try it Yourself »カウントバブルは、メールボックス内のメッセージなど、リスト項目に関連付けられた数値を表示するために使用します：
カウントバブルを追加するには、クラス "ui-li-count" を持つ <span> などのインライン要素を使用し、数値を追加します：
<ul data-role="listview">
<li><a href="#">Inbox<span class="ui-li-count">25</span></a></li>
<li><a href="#">Sent<span class="ui-li-count">432</span></a></li>
<li><a href="#">Trash<span class="ui-li-count">7</span></a></li>
</ul>
Try it Yourself »注: カウントバブルで正しい数値を表示するには、プログラムで更新する必要があります。 これについては後の章で説明します。
ポップアップリスト
ポップアップリストを作成する方法。
折畳み可能なリスト
コンテンツを非表示にしたり表示したりするリストを作成する方法。
折畳み可能なポップアップリスト
折畳み可能なポップアップリストを作成する方法。
全幅折畳みリスト
"collapsibles/collapsible set" の data-inset="false" 属性を使用して、全幅リストビューを有効にします。
その他のコンテンツ・フォーマティング
カレンダーを作る方法。