如何在 Bootstrap 中创建下拉菜单？

单击或悬停在下拉菜单上时会提供备选列表，这是一种提供备选列表的简洁方法，因为最初仅在屏幕上显示一个选项。现在几乎所有类型的软件都使用下拉菜单来显示选项的子选项。

第 1 步：要使用 bootstrap 将此下拉列表包含到您的网站中，您只需在 HTML 代码中包含以下 jQuery 和 bootstrap js 库作为脚本。

 
 

第 2 步：在 HTML 文档的头部包含以下样式表，以提供下拉菜单的外观。

第 3 步：确保将下拉菜单包含在.dropdown类、按钮或主选项中 .btn btn-primary dropdown-toggle类，以及.dropdown-menu类中的替代项列表，如下所示。

  
   
      Data Structures  
     
      
   
  
     
Array
  
     
Stack
  
     
Queue
  
   
  
  

.caret类用于在按钮中显示倒置的小三角形，如输出所示。

例子：

HTML

  

  
    
    
    
    
    
    
    
        .container {
            color: green;
        }
    

  

  
    
        GeeksforGeeks
        Dropdowns
        
            
                Data Structures 
                
            
            
                Array
                String
                Stack
                Queue
                Map
                Tree
            
        
    

  

输出：正如您在输出中看到的那样，创建了名为Data Structures的下拉按钮，单击它时，您会看到如上所示的选项列表。