📌 相关文章

📜 如何在 Bootstrap 中创建一个基本的按钮组？

📅 最后修改于: 2022-05-13 01:56:46.343000 🧑 作者: Mango

如何在 Bootstrap 中创建一个基本的按钮组？

按钮： .btn 类与

HTML



  

    Bootstrap Example
    
    
    
    
    

  

    
        GeeksForGeeks
        
            Vertical Button Group

HTML



  

    Bootstrap Example
    
    
    
    
    

  

    
        
            GeeksForGeeks
        
          
        
            Justified Button Groups
            
                
                    Login
                
                  
                
                    Signup
                
                  
                
                    Signin

输出：

在上面的示例中，按钮组被创建为单个按钮，就像在一行中排列了 3 个按钮登录、注册和登录。这些按钮是使用类 btn-group 创建的。

垂直按钮组：在 Bootstrap 中，垂直按钮组是按垂直顺序排列的。这些垂直按钮组是使用类.btn-group-vertical 创建的。

例子：

HTML



  

    Bootstrap Example
    
    
    
    
    

  

    
        GeeksForGeeks
        
            Vertical Button Group

输出：

在上面的示例中，创建了垂直按钮组。使用类 btn-group-vertical 以垂直顺序排列有 3 个按钮登录、注册和登录。

对齐按钮组：在 Bootstrap 中，对齐按钮组按屏幕宽度排列，按钮按宽度对齐。对齐按钮组是使用类.btn-group-justified 创建的。

例子：

HTML



  

    Bootstrap Example
    
    
    
    
    

  

    
        
            GeeksForGeeks
        
          
        
            Justified Button Groups
            
                
                    Login
                
                  
                
                    Signup
                
                  
                
                    Signin

输出：

在上面的示例中，创建了对齐的按钮组。有 3 个按钮登录、注册和登录使用对齐的顺序排列，即按钮与屏幕宽度对齐。这些对齐的按钮组是使用类 btn-group-justified 创建的。