mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 19:57:22 +08:00
71 lines
2.5 KiB
HTML
71 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html dir="ltr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Ionic Slides Basic</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
<script src="/dist/ionic.js"></script>
|
|
</head>
|
|
<body>
|
|
<ion-app>
|
|
<ion-header>
|
|
<ion-toolbar>
|
|
<ion-title>Button Icons</ion-title>
|
|
<ion-buttons slot="end">
|
|
<ion-button color="secondary">
|
|
Default
|
|
<ion-icon name="star" slot="end"></ion-icon>
|
|
</ion-button>
|
|
<ion-button color="secondary">
|
|
<ion-icon slot="icon-only" name="home"></ion-icon>
|
|
</ion-button>
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
</ion-header>
|
|
|
|
<ion-content>
|
|
<ion-item>
|
|
<ion-label>Item Icons</ion-label>
|
|
<ion-icon name="heart" slot="end"></ion-icon>
|
|
<ion-icon name="star" slot="start"></ion-icon>
|
|
</ion-item>
|
|
|
|
<ion-item>
|
|
<ion-label>Item No Size Button</ion-label>
|
|
<ion-button slot="start"><ion-icon name="heart" slot="end"></ion-icon>Start Button</ion-button>
|
|
<ion-button slot="end">End Button<ion-icon name="star" slot="start"></ion-icon></ion-button>
|
|
</ion-item>
|
|
|
|
<ion-item>
|
|
<ion-label>Item Outline Button</ion-label>
|
|
<ion-button outline slot="start"><ion-icon name="heart" slot="end"></ion-icon>Start Button</ion-button>
|
|
<ion-button outline slot="end">End Button<ion-icon name="star" slot="start"></ion-icon></ion-button>
|
|
</ion-item>
|
|
|
|
<ion-item>
|
|
<ion-label>Item Large Button</ion-label>
|
|
<ion-button large slot="start"><ion-icon name="star" slot="end"></ion-icon>Start Button</ion-button>
|
|
</ion-item>
|
|
|
|
<ion-item>
|
|
<ion-label>Item Large Button</ion-label>
|
|
<ion-button large slot="end">End Button<ion-icon name="star" slot="start"></ion-icon></ion-button>
|
|
</ion-item>
|
|
|
|
<ion-item>
|
|
<ion-label>Item Small Button</ion-label>
|
|
<ion-button small slot="start"><ion-icon name="star" slot="end"></ion-icon>Start Button</ion-button>
|
|
<ion-button small slot="end">End Button<ion-icon name="star" slot="start"></ion-icon></ion-button>
|
|
</ion-item>
|
|
|
|
<ion-item>
|
|
<ion-label>Item Default Button</ion-label>
|
|
<ion-button default slot="start"><ion-icon name="star" slot="end"></ion-icon>Start Button</ion-button>
|
|
<ion-button default slot="end">End Button<ion-icon name="star" slot="start"></ion-icon></ion-button>
|
|
</ion-item>
|
|
|
|
</ion-content>
|
|
</ion-app>
|
|
</body>
|
|
</html>
|