Bootstrap导航栏各元素操作方法(表单、按钮、文本)_javascript技巧

本文主要包括三大方面，大家仔细学习。

1、导航栏中的表单
导航栏中的表单不是使用 Bootstrap 表单 章节中所讲到的默认的 class，它是使用 .navbar-form class。这确保了表单适当的垂直对齐和在较窄的视口中折叠的行为。使用对齐方式选项（这将在组件对齐方式部分进行详细讲解）来决定导航栏中的内容放置在哪里。

下面的实例演示了这点：

 
 
 
   林炳文在此～ 
  
 
  
 
   

导航一
 
     
导航二
 
     
 
       
        下拉菜单 
         
       
      

我是谁呢？
 
        
我也不知道
 
        
你是谁呢？
 
        
 
        
分离的链接
 
        
 
        
另一个分离的链接
 
      
 
   
 
  
 
   
 
     
 
      
 
     搜一下 
   
   
  
 

效果：

黑色效果

2、导航栏中的按钮
您可以使用 class .navbar-btn 向不在

中的 元素添加按钮，按钮在导航栏上垂直居中。.navbar-btn 可被使用在 和 元素上。

不要在 .navbar-nav 内的 元素上使用 .navbar-btn，因为它不是标准的 button class。
下面的实例演示了这点：

 
 
 
   林炳文在此～ 
  
 
  
 
   

导航一
 
     
导航二
 
     
 
       
        下拉菜单 
         
       
      

我是谁呢？
 
        
我也不知道
 
        
你是谁呢？
 
        
 
        
分离的链接
 
        
 
        
另一个分离的链接
 
      
 
   
 
  
 
    
     
 
      
 
     

搜一下

导航栏按钮