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.

Requires the use of a specified type at all times.

Note: the file type input field needs to be marked up dfferently so is not included within this basic control section

Textarea

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

Checkboxes and radios

Checkboxes are for selecting one or several options in a list, while radios are for selecting one option from many.

A checkbox or radio with the disabled attribute will be styled appropriately. To have the <label> for the checkbox or radio also display a "not-allowed" cursor when the user hovers over the label, add the .disabled class to your <input>, or <fieldset>.

Default (stacked)


Inline checkboxes and radios

Add the .inline class to a series of checkboxes or radios for controls appear on the same line.


Selects

Use the default option or specify a multiple="multiple" to show multiple options at once.


Static control

When you need to place plain text next to a form label within a form, use the .static-control class on a <p>.

email@example.com

email@example.com