Form Elements
Textual inputs
Here are examples of
.form-control
applied to
each
textual HTML5
<input>
type
.
Sizing
Set heights using classes like
.form-control-lg
and
.form-control-sm
.
Range Inputs
Create custom
<input type="range">
controls with
.form-range
.
Min and max
Range inputs have implicit values for min and maxâ0 and 100, respectively.
Steps
By default, range inputs âsnapâ to integer
values. To change this, you can specify a
step
value.
Checkboxes
Form Checkboxes
Form Checkboxes Right
Form Checkboxes colors
Add class
.form-check-*
for a color
Checkboxes
Form Checkboxes Outline
Add class
.form-checkbox-outline
&
.form-check-*
for a color Checkboxes
Radios
Form Radios
Form Radios Right
Form Radio colors
Add class
.form-radio-*
for a
color Radios
Form Radio Outline
Add class
form-radio-outline
&
.form-radio-*
for a color Checkboxes
Switches
A switch has the markup of a custom checkbox but uses the
.form-switch
class to render a toggle switch. Switches also support the
disabled
attribute.