Form
Bootstrap features styles for browser-supported focused and disabled
states. We remove the default Webkit outline
and apply a box-shadow
in its place for :focus
.
Form validation
It also includes validation styles for errors, warnings, and success. To use, add the error class to the surrounding .control-group
.
- <fieldset
- class="control-group error">
- …
- </fieldset>
Extending form controls
Prepend & append inputs
Input groups—with appended or prepended text—provide an easy way to give more context for your inputs. Great examples include the @ sign for Twitter usernames or $ for finances.
Checkboxes and radios
Up to v1.4, Bootstrap required extra markup around checkboxes and radios to stack them. Now, it's a simple matter of repeating the <label class="checkbox">
that wraps the <input type="checkbox">
.
Inline checkboxes and radios are also supported. Just add .inline
to any .checkbox
or .radio
and you're done.
Inline forms and append/prepend
To use prepend or append inputs in an inline form, be sure to place the .add-on
and input
on the same line, without spaces.
Form help text
To add help text for your form inputs, include inline help text with <span class="help-inline">
or a help text block with <p class="help-block">
after the input element.