Latest web development tutorials

tête ionique et en bas

Header (en-tête)

ensemble d'en-tête est fixé sur le haut de l'écran, vous pouvez emballer telles que le titre et la fonction des boutons autour.

défaut ionique fournit de nombreux types de style de couleur, vous pouvez appeler un nom de style différent, bien sûr, vous pouvez personnaliser un.

bar-lumière

<div class="bar bar-header bar-light">
  <h1 class="title">bar-light</h1>
</div>

Essayez »

bar-stable

<div class="bar bar-header bar-stable">
  <h1 class="title">bar-stable</h1>
</div>

Essayez »

bar-positif

<div class="bar bar-header bar-positive">
  <h1 class="title">bar-positive</h1>
</div>

Essayez »

bar-calme

<div class="bar bar-header bar-calm">
  <h1 class="title">bar-calm</h1>
</div>

Essayez »

bar équilibré

<div class="bar bar-header bar-balanced">
  <h1 class="title">bar-balanced</h1>
</div>

Essayez »

bar hors tension

<div class="bar bar-header bar-energized">
  <h1 class="title">bar-energized</h1>
</div>

Essayez »

bar-assertive

<div class="bar bar-header bar-assertive">
  <h1 class="title">bar-assertive</h1>
</div>

Essayez »

bar-royal

<div class="bar bar-header bar-royal">
  <h1 class="title">bar-royal</h1>
</div>

Essayez »

bar-dark

<div class="bar bar-header bar-dark">
  <h1 class="title">bar-dark</h1>
</div>

Essayez »


Sous-tête (sous-titré)

Sous-tête est également fixé au sommet, juste en dessous de l'en-tête, il est, même si cela n'a pas écrit en-tête, Sous-tête Ce style a également un en-tête du haut de la distance. style de couleur avec en-tête.

<div class="bar bar-header">
  <h1 class="title">Header</h1>
</div>
<div class="bar bar-subheader">
  <h2 class="title">Sub Header</h2>
</div>

Essayez »


Pied de page (en bas)

Pied de page se trouve au bas de l'écran peut contenir plusieurs types de contenu.

<div class="bar bar-footer bar-balanced">
  <div class="title">Footer</div>
</div>

Essayez »

Pied de page avec l'en-tête ci-dessus, seul le nom de style bar-tête pour faire bar-pied de page.

<div class="bar bar-footer">
  <button class="button button-clear">Left</button>
  <div class="title">Title</div>
  <button class="button button-clear">Right</button>
</div>

Essayez »

En outre, si le fond n'a pas de titre, mais ils ont besoin sur le bouton droit, vous avez besoin sur le bouton de droite pour ajouter pull-droite, tels que:

<div class="bar bar-footer">
  <button class="button button-clear pull-right">Right</button>
</div>

Essayez »