ionic2
Ionic2-CSS-Komponenten
Suche…
Gitter
Das Rastersystem von Ionic basiert auf Flexbox, einer CSS-Funktion, die von allen von Ionic unterstützten Geräten unterstützt wird. Das Gitter besteht aus drei Einheiten-Gittern, Zeilen und Spalten. Spalten werden erweitert, um ihre Zeile zu füllen, und die Größe wird für zusätzliche Spalten angepasst.
| Klasse | Breite |
|---|---|
| Breite-10 | 10% |
| Breite-20 | 20% |
| Breite-25 | 25% |
| Breite-33 | 33.3333% |
| Breite-50 | 50% |
| Breite-67 | 66.6666% |
| Breite-75 | 75% |
| Breite-80 | 80% |
| Breite-90 | 90% |
Beispiel.
<ion-grid>
<ion-row>
<ion-col width-10>This column will take 10% of space</ion-col>
</ion-row>
</ion-grid>
Karten
Karten sind eine großartige Möglichkeit, wichtige Inhalte anzuzeigen und entwickeln sich schnell zu einem zentralen Entwurfsmuster für Apps. Sie sind eine großartige Möglichkeit, Informationen zu enthalten und zu organisieren, und stellen gleichzeitig vorhersehbare Erwartungen für den Benutzer auf. Mit so vielen Inhalten, die auf einmal angezeigt werden können, und oft so wenig Bildschirmfläche, sind Karten für viele Unternehmen schnell zum Muster der Wahl geworden.
Beispiel.
<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>
