Form Elements
Bootstrap Basic Form
Here’s a quick example to demonstrate Bootstrap’s form styles. Keep reading for documentation on required classes, form layout, and more.
Basic Form
Here’s a quick example to demonstrate Bootstrap’s form styles. Keep reading for documentation on required classes, form layout, and more.
Textual inputs
Here are examples of .form-controlapplied to each textual HTML5 <input>type.
Inline Form
Use the .form-inline class to display a series of labels, form controls, and buttons on a single horizontal row. Form controls within inline forms vary slightly from their default states..
Checkboxs
For even more customization and cross browser consistency, use our completely custom form elements to replace the browser defaults. They’re built on top of semantic and accessible markup, so they’re solid replacements for any default form control.
Radios
For even more customization and cross browser consistency, use our completely custom form elements to replace the browser defaults. They’re built on top of semantic and accessible markup, so they’re solid replacements for any default form control.
Range Inputs
Set horizontally scrollable range inputs using .form-control-range.
Range
Create custom <input type="range">controls with .custom-range.
Range Steps
By default, range inputs “snap” to integer values. To change this, you can specify a stepvalue. In the example below, we double the number of steps by using step="0.5".
Static Input groups
Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.
Buttons Input groups
Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.
Dropdowns Input groups
Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.