contact

Contact Person
Pin BB : 5AB31960
SMS : 082288467823
WA : 081275371724
call : 081275668074

Merubah warna Menu navigation bar Bootstrap

Posted in Tutorial Bootstrap Life at 21 Oktober 2016 With 0 Comments

Bagaiaman mengganti warna menu navigation pada bootstrap.. ?Tutorial kali ini kita akan membahas Cara Merubah Warna Menu atau Navigation Bar Bootstrap , Artikel ini berawal dari project admin dalam pengembangan aplikasi bootstrap , belum tahu mengganti warna menu bootstrap , makanya searching di google, dan juma.. Nah.. disitu admin merasa perlu menulis artikel ini, sebagai bahan untuk admin sendiri, dan semoga bermanfaat untuk pembaca suckittrees.com

Navigation Bar atau yang disingkat dengan navbar pada Bootstrap merupakan bagian navigasi yang secara default berada pada bagian atas. Namun kita juga dapat merubahnya menjadi posisi bawah, sehingga menjadi footer , ketahui bersama pada navbar di bootstrap hanya ada dua warna yaitu warna putih (default) dan warna hitam (inverse).

Cara Mengganti Warna Menu Navigation Bar Bootstrap

▼ Download Source Code Dibawah Ini ▼


saya contohkan berikut code untuk membuat menu navigation bar bootstrap :

<div class="navbar navbar-inverse">
 <div class="container">
  <div class="navbar-header">
   <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
   </button>
  </div>
  <div class="navbar-collapse collapse">
   <ul class="nav navbar-nav navbar-right">
    <li class="active"><a href="index.html">Home</a></li>
    <li><a href="about.html">Programming</a></li>
    <li><a href="courses.html">English</a></li>
    <li><a href="price.html">Review</a></li>
    <li><a href="videos.html">Videos</a></li>
    <li><a href="videos.html">Gallery</a></li>
    <li><a href="contact.html">Contact</a></li>
   </ul>
  </div>
 </div>
</div>

 Kemudian tambahkan style :

<style type="text/css">
    .navbar-inverse {
    background-color: #3b5998;
    font-size:18px;
    }
</style>

 OK.. silahkan anda ganti sendiri dengan warna yang anda sukai pada bagian backgorund-color nya.. dan selamat berkreasi.. salam koding

Artikel Terkait

Diskusi