Form Elements

email@example.com

A block of help text that breaks onto a new line and may extend beyond one line.
Multiple select
Input States

Bootstrap includes validation styles for error, warning, and success states on form controls.

Input Sizes

Set heights using classes like .input-lg, and set widths using grid column classes like .col-lg-*.

Input groups

Extend form controls by adding text or buttons before, after, or on both sides of any text-based <input>. Use .input-group with an .input-group-addon or .input-group-btn to prepend or append elements to a single .form-control.

Basic example

Horizontal form

Select menu

Custom <select> menus need only a custom class, .custom-select to trigger the custom styles.

Switches

A switch has the markup of a custom checkbox but uses the .custom-switch class to render a toggle switch. Switches also support the disabled attribute.

Bootstrap Checkboxes and radios

Checkbox and Radio

Basic

Supports bootstrap brand colors: .checkbox-primary, .checkbox-info etc.

Checkboxes without label text .checkbox-single

Inline checkboxes

Circled

.checkbox-circle for roundness.

Checkboxes without label text .checkbox-single

Inline checkboxes

Disabled

Disabled state also supported.

Basic

Supports bootstrap brand colors: .radio-primary, .radio-danger etc.

Radios without label text .radio-single

Inline radios

Disabled

Disabled state also supported.