Input Style
Use the input classes on an .input-default, input-flat, .input-rounded for Default input.
Textarea
Checkboxes
Inline Checkboxes
Use the .form-check-inline class if you want the checkboxes to appear on the same line
Radio Buttons
Radio Inline
Select List
Bootstrap Input File
Input Size
Set heights using classes like .form-control-lg and .form-control-sm.
Select Size
Set heights using classes like .form-control-lg and .form-control-sm.
Readonly
Add the readonly boolean attribute on an input to prevent modification of the input’s value
Readonly
use the .form-control-plaintext class to remove the default form field styling and preserve the correct margin and padding.
Inline Form
use the .form-inline class to for inline form styles.
Form grid
Form Row
Vertical Form
Vertical Form
Form Label Size
Be sure to use .col-form-label-sm .col-form-label-lg correctly follow the size of .form-control-lg and .form-control-sm.
Column size
Auto-sizing
The example below uses a flexbox utility to vertically center the contents and changes .col .col-auto so that your columns only take up as much space as needed. Put another way, the column sizes itself based
on the contents.
Custom Select
Custom Checkbox
Disabled forms
Add the disabled boolean attribute on an input to prevent user interactions and make it appear lighter.