Latest web development tutorials

Kepala ionik dan bawah

Header (header)

perakitan header tetap ke atas layar, Anda dapat pak seperti judul dan fungsi tombol di sekitar.

bawaan ionik memberikan berbagai jenis gaya warna, Anda dapat memanggil nama gaya yang berbeda, tentu saja, Anda dapat menyesuaikan.

bar-light

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

Coba »

bar-stabil

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

Coba »

bar-positif

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

Coba »

bar-tenang

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

Coba »

bar seimbang

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

Coba »

bar-energi

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

Coba »

bar-tegas

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

Coba »

bar-royal

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

Coba »

bar-gelap

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

Coba »


Sub Header (subtitle)

Sub Header juga tetap di bagian atas, tepat di bawah Header itu, bahkan jika ini tidak menulis Header, sub header Gaya ini juga memiliki header dari atas jarak. gaya warna dengan header.

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

Coba »


Footer (bawah)

Footer adalah di bagian bawah layar dapat berisi beberapa jenis konten.

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

Coba »

Footer dengan header di atas, hanya nama gaya bar-header untuk melakukan bar-footer.

<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>

Coba »

Selain itu, jika bagian bawah tidak memiliki judul, tetapi mereka perlu tombol kanan, Anda perlu tombol kanan untuk menambahkan pull-benar, seperti:

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

Coba »