イオンリスト
リストには、すべてのモバイルアプリで使用するために、ほとんど常に、広く使用されているインターフェイス要素です。
リストは、基本的なテキスト、ボタン、スイッチ、及び他のサムネイルアイコンとすることができます。
リスト項目は、任意のHTML要素にすることができます。 クラスリストに必要なコンテナ要素は、各リスト項目は、項目のカテゴリを必要とされます。
ionList ionItem、簡単に、このようなスライド編集などのインタラクティブ、さまざまな方法をサポートして並べ替えをドラッグして、アイテムを削除することができます。
基本的な使い方：
<ul class="list">
<li class="item">
...
</li>
</ul>
リストの区切り
我々は区別するために異なる背景色と太字フォントで、デフォルトでは、項目のリストを区切りリストを作成する項目分圧器のクラスを使用できますが、簡単に彼をカスタマイズすることができます。
<div class="list">
<div class="item item-divider">
Candy Bars
</div>
<a class="item" href="#">
Butterfinger
</a>
...
</div>
アイコンのリストと
私たちは、リスト項目の左側または右側にアイコンを指定することができます。
右側、左側に項目アイコン右設定アイコンをアイテムアイコン左のアイコンを使用してください。 アイコンの両面が必要な場合は、2クラスが上に追加されます。
各リスト項目のクリック可能なように、以下の例では、我々は、リスト項目に<A>ラベルを使用していました。
あなたが<A>または<ボタン>要素を使用すると、アイコンの右側が追加されていない場合は、リストアイテム、それは自動的に矢印に追加されます。
例では、最初のアイテムのみ2番目のアイコンを持ってについて、右側の3番目のアイコンが表示され、左側のアイコン（だけでなく、ノートアイテム-noteが）、第四は、バッジ（マーク）の要素を持っています。
<div class="list">
<a class="item item-icon-left" href="#">
<i class="icon ion-email"></i>
Check mail
</a>
<a class="item item-icon-left item-icon-right" href="#">
<i class="icon ion-chatbubble-working"></i>
Call Ma
<i class="icon ion-ios-telephone-outline"></i>
</a>
<a class="item item-icon-left" href="#">
<i class="icon ion-mic-a"></i>
Record album
<span class="item-note">
Grammy
</span>
</a>
<a class="item item-icon-left" href="#">
<i class="icon ion-person-stalker"></i>
Friends
<span class="badge badge-assertive">0</span>
</a>
</div>
ボタンリスト
クラスリストの項目に項目ボタン右または項目ボタン左ボタンを使用します。
<div class="list">
<div class="item item-button-right">
Call Ma
<button class="button button-positive">
<i class="icon ion-ios-telephone"></i>
</button>
</div>
...
</div>
アバターリストによる
アイテム・アバターがリストにアバターを作成して使用します。
<div class="list">
<a class="item item-avatar" href="#">
<img src="venkman.jpg">
<h2>Venkman</h2>
<p>Back off, man. I'm a scientist.</p>
</a>
...
</div>
サムネイル一覧
サムネイルアイテムサムネイル左のクラスは、左揃え、アイテムサムネイル右のクラスが右揃えにサムネイルを追加するために使用される追加します。
<div class="list">
<a class="item item-thumbnail-left" href="#">
<img src="cover.jpg">
<h2>Pretty Hate Machine</h2>
<p>Nine Inch Nails</p>
</a>
...
</div>
組み込みリスト（インセットリスト）
私たちは、リストの中の容器に埋め込むことができ、リストは全幅が表示されません。
インラインスタイルのリストです：リストlist-はめ込み、差の一般的なリストでそれがタブに似マージン（marign）を、設定していることです。
組み込みリストは影ではないスクロールするとき、効果はさらに良くなります。
<div class="list list-inset">
<div class="item">
Raiders of the Lost Ark
</div>
...
</div>