Forms

All form controls automatically receive some global styling. Form elements with .form-control are set to width: 100%; by default. Wrap labels and controls in .form-group for optimum spacing.

Example:

Source Code:

    

        * Email address
        
    

    

        * Password
        
    

    


        File input
        
        
            Example block-level help text here.
        
    

    

        

            
            
                Check me out
            
        
    

    Submit

Sample contact form:

Source Code:

                        

                        

                        * Name
                        







        
                        

                        * Email address
                        







        
    
    
                        

                        Your Message
        <textarea id="exampleInputComment" class="form-control" rows="10" cols="80"></textarea>
    
                        Submit

                    

Form states and sizes:

Source Code:

    

        First name
        

            

                
            
            

        
        

            Disabled.
        
    
    

        Last name
        

            

                
            
            
            

                Looks Good.
            
        
    
    

        Username
        

            

                
            
            
            

                Please choose a username.
            
        
    



    Email
    

        
    


    Phone
    

        
    



    Password
    

        
    

Custom file input:

Source Code:

    
    Choose file...
    
Bootstrap 4 custom file input.

Custom radio buttons and checkboxes:

Source Code:

 

    
        
        

            
        
        USA
    
    
        
        

            
        
        Canada
    
    
        
        

            
        
        United Kingdom
    
    
        
        

            
        
        Sweden
    



    
        
        Italy
    

    
        
        UK
    

    
        
        USA
    




    

        
        Toggle this custom radio
    
    

        
        Or toggle this other custom radio
    



    
        
        

            
        
        USA
    

    
        
        

            
        
        USA
    



    
        
        Canada
    

    
        
        UK
    

    
        
        Mexico
    



    

        
        Check this custom checkbox