ionic2
Composants Ionic2 CSS
Recherche…
la grille
Le système de grille d'Ionic est basé sur la flexbox, une fonctionnalité CSS prise en charge par tous les périphériques supportés par Ionic. La grille est composée de trois unités-grille, lignes et colonnes. Les colonnes seront développées pour remplir leur ligne et seront redimensionnées pour s'adapter à des colonnes supplémentaires.
| Classe | Largeur |
|---|---|
| largeur-10 | dix% |
| largeur-20 | 20% |
| largeur-25 | 25% |
| largeur-33 | 33,3333% |
| largeur-50 | 50% |
| largeur-67 | 66.6666% |
| largeur-75 | 75% |
| largeur-80 | 80% |
| largeur-90 | 90% |
Exemple.
<ion-grid>
<ion-row>
<ion-col width-10>This column will take 10% of space</ion-col>
</ion-row>
</ion-grid>
Cartes
Les cartes sont un excellent moyen d’afficher des éléments de contenu importants et se révèlent rapidement comme un modèle de conception de base pour les applications. Ils sont un excellent moyen de contenir et d'organiser les informations, tout en définissant des attentes prévisibles pour l'utilisateur. Avec un tel contenu à afficher à la fois, et souvent si peu d’écran, les cartes sont rapidement devenues le modèle de choix pour de nombreuses entreprises.
Exemple.
<ion-card>
<ion-card-header>
Header
</ion-card-header>
<ion-card-content>
The British use the term "header", but the American term "head-shot" the English simply refuse to adopt.
</ion-card-content>
</ion-card>