Menu thanh điều hướng bootstrap

Bước 1. Tạo cấu trúc HTML

 
 

  

   
 
 
   

   

    
GỌI NGAY: 0199 257 6350 - 0932 152 592
   

  




  

   
    

     

       Toggle navigation    
      
 
     

     

      

       
Trang chủ
       
       
 Khóa học 
        

         
Chuyên viên website lành nghề online
         
         
Lập trình PHP cơ bản online
         
         
Thiết kế giao diện website online
         
         
Lập trình HTML5,CSS3,RWD,JS,BOTSTRAP Online
         
        
       
       
Đăng ký
       
       
Đồ án
       
       
Dịch vụ
       
       
Hỏi đáp
       
       
Blog
       
       
Các câu hỏi thường gặp
       
       
Phiếu đánh giá của học viên
       
       
Khách hàng thân thiết
       
       
Tư vấn thiết kế website
       
      
      
Hướng dẫn đăng ký
      
     

    

   
  

 

Bước 2. Tải xuống CSS

.toplogo {
 
max-height: 70px;
 
max-width: 210px;
 
margin: 12px 11px;

}


.callnow {
 
font-weight: 200;
 
color: #333;
 
vertical-align: middle;
 
line-height: 35px;
 
font-size: 19px;
 
padding-right: 8px;

}


.topper {
    
display: flex;
    
justify-content: space-between;
    
align-items: flex-end;

}


.navbar.navbar-inverse {
    
background-image: linear-gradient(#9f9f9f, #535353 3%, #1f1f1f 17%, #212121 49%, #191919 89%, #000000 100%);
    
border-top: 1px inset rgba(255, 255, 255, 0.1);
    
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.5);
    
border-radius: 10px;
    
margin-top: 10px;

}

.navbar .navbar-nav > li > a {
    
color: #d1d1d1;
    
font-weight: 700;
    
text-rendering: optimizeLegibility;
    
text-shadow: 0px -1px black, 0px 1px rgba(255, 255, 255, 0.25);
    
line-height: 18px;

}


.navbar .navbar-nav > li.active {
    
color: #f8f8f8;
    
background-color: #080808;
    
box-shadow: inset 0px -28px 23px -21px rgba(255, 255, 255, 0.15);
    
border-left: 1px solid #2A2A2A;
    
border-right: 1px solid #272727;

}


.btn.btn-gradient-blue {
    
background-color: #0c5497 !important;
    
background-image: -webkit-linear-gradient(top, #127bde 0%, #072d50 100%);
    
background-image: -o-linear-gradient(top, #127bde 0%, #072d50 100%);
    
background-image: linear-gradient(to bottom, #127bde 0%, #072d50 100%);
    
background-repeat: repeat-x;
 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff127bde', endColorstr='#ff072d50', GradientType=0);
    
border-color: #072d50 #072d50 #0c5497;
    
color: #fff !important;
    
text-shadow: 0 -1px 0 rgba(31, 31, 31, 0.29);
    
-webkit-font-smoothing: antialiased;

}

Bước 3. Call library Bootstrap and awesome Fonts

Bước 4. Call library JQUERY