引导程序4 |轮播

Bootstrap Carousel用于为网页创建图像幻灯片，以使其看起来更具吸引力。可以使用bootstrap.js或bootstrap.min.js将其包含在网页中。 Internet Explorer不正确支持轮播，这是因为它们使用CSS3过渡和动画来实现幻灯片效果。

例子：

 
 
 
    Carousel 
      
    
    
  
    
      
    
    
      
    
    
      
    
    
      
    
  /* Make the image fully responsive */
  .carousel-inner img {
      width: 100%;
      height: 100%;
  }
  
 
  

    
      
    
    
        
        
        
        
    
        
    
    
        
            
        
          
        
            
        
          
        
            
        
          
        
            
        
    
        
      
        
      
      
        
      
    
 
  
                    

输出：

将标题添加到幻灯片：在.carousel-item类中使用.carousel-caption用于向幻灯片添加标题。

例子：

 
 
 
    Carousel 
      
    
    
  
    
      
    
    
      
    
    
      
    
    
      
    
        /* Set the image size */
        .carousel-inner img {
            width: 100%;
          
        }
    
 
  

    
      
    
    
        
        
        
    
      
    
    
        
            
              
            
                
                    GeeksforGeeks: Interview Preparation Caption
                
               
        
          
        
            
              
            
                
                    GeeksforGeeks: Geeks Classes Caption
                
             
        
          
        
            
              
            
                
                    GeeksforGeeks: Geeks Classes Caption
                
             
        
    
      
    
        
    
    
        
    
    
 
  
                                

输出：