Common Bootstrap Forms | Unify - Responsive Website Template

Individual form controls automatically receive some global styling. All textual input, textarea, and select elements with .form-control are set to width: 100%; by default. Wrap labels and controls in .form-group for optimum spacing.
You can find more example here: http://getbootstrap.com/css/#forms

Basic Form

Horizontal Form

Inline Form

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 to prepend or append elements to a .form-control.

Basic Example

.00

$ .00

Checkboxes and Radio Addons

Button Addons and Buttons with Dropdowns

Buttons in input groups are a bit different and require one extra level of nesting. Instead of .input-group-addon, you'll need to use .input-group-btn to wrap the buttons. This is required due to default browser styles that cannot be overridden.

Standard Form Controls

Inputs

Most common form control, text-based input fields. Includes support for all HTML5 types: text, password, datetime, datetime-local, date, month, time, week, number, email, url, search, tel, and color.

Textarea

Form control which supports multiple lines of text. Change rows attribute as necessary.

Checkboxes and Radios

Option one is this and that—be sure to include why it's great

Option two can be something else and selecting it will deselect option one

1 2 3

Selects

Use the default option, or add multiple to show multiple options at once.

Validation States

Bootstrap includes validation styles for error, warning, and success states on form controls. To use, add .has-warning, .has-error, or .has-success to the parent element. Any .control-label, .form-control, and .help-block within that element will receive the validation styles.

Input with success

Input with warning

Input with error

Control Sizing

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

Typography & Components

Buttons & Icons

Common elements

Forms & Infographics

Basic Form

Horizontal Form

Inline Form

Input groups

Basic Example

Checkboxes and Radio Addons

Button Addons and Buttons with Dropdowns

Standard Form Controls

Inputs

Textarea

Checkboxes and Radios

Selects

Validation States

Control Sizing

Control Sizing

Latest Posts

Useful Links

Contact Us