mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
84 lines
1.4 KiB
HTML
84 lines
1.4 KiB
HTML
<ion-toolbar><ion-title>List Headers/Footers</ion-title></ion-toolbar>
|
|
|
|
<ion-list>
|
|
|
|
<ion-header>
|
|
List Header
|
|
</ion-header>
|
|
|
|
<div class="item">
|
|
<icon name="ion-wifi"></icon>
|
|
<div class="item-content">
|
|
Wifi
|
|
</div>
|
|
<div class="item-note">
|
|
Terrible
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<icon name="ion-heart"></icon>
|
|
<div class="item-content">
|
|
Affection
|
|
</div>
|
|
<div class="item-note">
|
|
Very Little
|
|
</div>
|
|
</div>
|
|
|
|
</ion-list>
|
|
|
|
<ion-list>
|
|
|
|
<ion-header>
|
|
List Header
|
|
</ion-header>
|
|
|
|
<div class="item">
|
|
<icon name="ion-wand"></icon>
|
|
<div class="item-content">
|
|
Magic
|
|
</div>
|
|
<div class="item-note">
|
|
Activated
|
|
</div>
|
|
</div>
|
|
|
|
<ion-footer>
|
|
List Footer
|
|
</ion-footer>
|
|
|
|
</ion-list>
|
|
|
|
<ion-list>
|
|
|
|
<ion-header>
|
|
List Header with text that is too long to fit inside the list header
|
|
</ion-header>
|
|
|
|
<div class="item">
|
|
<icon name="ion-pizza"></icon>
|
|
<div class="item-content">
|
|
Pizza
|
|
</div>
|
|
<div class="item-note">
|
|
Always
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<icon name="ion-beer"></icon>
|
|
<div class="item-content">
|
|
Beer
|
|
</div>
|
|
<div class="item-note">
|
|
Yes Plz
|
|
</div>
|
|
</div>
|
|
|
|
<ion-footer>
|
|
List Footer with text that is also too long why do you do this all the time plz stop its too long!
|
|
</ion-footer>
|
|
|
|
</ion-list>
|