mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
96 lines
2.0 KiB
HTML
96 lines
2.0 KiB
HTML
<ion-toolbar><ion-title>Item Icons</ion-title></ion-toolbar>
|
|
|
|
<ion-list>
|
|
|
|
<div class="item">
|
|
<div class="item-content">
|
|
Div with forward icon
|
|
</div>
|
|
<icon forward></icon>
|
|
</div>
|
|
|
|
<a class="item" href="#">
|
|
<div class="item-content">
|
|
Link with forward icon
|
|
</div>
|
|
<icon forward></icon>
|
|
</a>
|
|
|
|
<button class="item">
|
|
<div class="item-content">
|
|
Button with forward icon
|
|
</div>
|
|
<icon forward></icon>
|
|
</button>
|
|
|
|
<a class="item" href="#">
|
|
<div class="item-content">
|
|
Link with right side default icon
|
|
</div>
|
|
<icon name="ion-ios-information-outline"></icon>
|
|
</a>
|
|
|
|
<a class="item" href="#">
|
|
<div class="item-content">
|
|
Link with right side large icon
|
|
</div>
|
|
<icon large name="ion-ios-information-outline"></icon>
|
|
</a>
|
|
|
|
<a class="item" href="#">
|
|
<div class="item-content">
|
|
Link with right side small icon
|
|
</div>
|
|
<icon small name="ion-ios-information-outline"></icon>
|
|
</a>
|
|
|
|
<button class="item">
|
|
<icon name="ion-star"></icon>
|
|
<div class="item-content">
|
|
Button with left side icon
|
|
</div>
|
|
</button>
|
|
|
|
<button class="item">
|
|
<icon name="ion-flag"></icon>
|
|
<div class="item-content">
|
|
Button with both side icons
|
|
</div>
|
|
<icon name="ion-ios-checkmark"></icon>
|
|
</button>
|
|
|
|
<a class="item" href="#">
|
|
<div class="item-content">
|
|
Link with two right side icons
|
|
</div>
|
|
<icon name="ion-checkmark-circled"></icon>
|
|
<icon name="ion-shuffle"></icon>
|
|
</a>
|
|
|
|
<button class="item">
|
|
<icon name="ion-clipboard"></icon>
|
|
<icon name="ion-minus-circled"></icon>
|
|
<div class="item-content">
|
|
Button with two left side icons
|
|
</div>
|
|
</button>
|
|
|
|
<button class="item">
|
|
<div class="item-content">
|
|
Red Balloons
|
|
</div>
|
|
<div class="badge">99</div>
|
|
</button>
|
|
|
|
</ion-list>
|
|
|
|
|
|
<style>
|
|
body {
|
|
//background-image: url(/ionic2-iOS-component-design.png);
|
|
background-repeat: no-repeat;
|
|
background-size: 3906px 634px;
|
|
background-position: -34px -53px;
|
|
}
|
|
</style>
|