Tuesday, October 2, 2018

Tutorial Bootstrap #7: Membuat Jumbotron


Hai semuanya...

Pada tutorial kali ini kita akan belajar membuat jumbotron dengan Bootstrap, jumbotron merupakan sebuah box besar untuk menampilkan sebuah informasi atau konten yang spesial.

Membuat Jumbotron

Untuk membuat jumbotron pada Bootstrap, tambahkan class “jumbotron” pada tag <div> setelah itu tambahkan sebuah informasi, contohnya sebagai berikut.
  <div class="jumbotron">
    <h1>Kode Kuliahan</h1>
    <p>Kode Kuliahan merupakan sebuah blog berkategori edukasi
    yang membahas tutorial HTML, CSS, Java Script, PHP, MySQL lainnya juga.</p>
  </div>
Hasilnya.


Menambahkan Button

Selain text, didalam jumbotron, kita dapat menambahkan sebuah button, contohnya sebagai berikut.
Baca juga - Cara membuat button dengan Bootstrap

  <div class="jumbotron">
    <h1>Kode Kuliahan</h1>
    <p>Kode Kuliahan merupakan sebuah blog berkategori edukasi
    yang membahas tutorial HTML, CSS, Java Script, PHP, MySQL lainnya juga.</p>
    <a href="#" class="btn btn-primary btn-lg">Selengkapnya</a>
  </div>
Hasilnya.


Demikian, tutorial membuat jumbotron dengan Bootstrap, semoga tutorial ini bermanfaat, mohon maaf jika ada kesalahan, jika ada pertanyaan mengenai tutorial ini, silahkan tuliskan komentar anda dibawah, terima kasih.

0 komentar:

Post a Comment