mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-10 00:27:41 +08:00
88 lines
1.9 KiB
HTML
88 lines
1.9 KiB
HTML
<ion-toolbar><ion-title>Item Text</ion-title></ion-toolbar>
|
|
|
|
<ion-list>
|
|
|
|
<div class="item">
|
|
<div class="item-content">
|
|
Plain Ol' div with some text
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item-content">
|
|
Single line text that should have ellipses when it doesn't all fit in the item
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item-content">
|
|
Column
|
|
</div>
|
|
<div class="item-content">
|
|
Column
|
|
</div>
|
|
<div class="item-content">
|
|
Column
|
|
</div>
|
|
<div class="item-content">
|
|
Column
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item-content align-left">
|
|
align-left
|
|
</div>
|
|
<div class="item-content align-center">
|
|
align-center
|
|
</div>
|
|
<div class="item-content align-right">
|
|
align-right
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item-content item-text-wrap">
|
|
Multiline text that should wrap when it is too long to fit on one line in the item. Class on .item-content
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item item-text-wrap">
|
|
<div class="item-content">
|
|
Multiline text that should wrap when it is too long to fit on one line in the item. Class on .item
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item item-text-wrap">
|
|
<div class="item-content">
|
|
<h1>H1 Title Text</h1>
|
|
<p>Paragraph line 1</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item item-text-wrap">
|
|
<div class="item-content">
|
|
<h2>H2 Title Text</h2>
|
|
<p>Paragraph line 1</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item item-text-wrap">
|
|
<div class="item-content">
|
|
<h3>H3 Title Text</h3>
|
|
<p>Paragraph line 1</p>
|
|
<p>Paragraph line 2</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item item-text-wrap">
|
|
<div class="item-content">
|
|
<h4>H4 Title Text</h4>
|
|
<p>Paragraph line 1</p>
|
|
<p>Paragraph line 2</p>
|
|
<p>Paragraph line 3</p>
|
|
</div>
|
|
</div>
|
|
|
|
</ion-list>
|