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

Set horizontally scrollable range inputs using .form-control-range.

Example
Custom Range

Checkboxes

Default Checkboxes
Custom Checkboxes
Custom Checkboxes colors

Add class .custom-checkbox-* for a color Checkboxes

Custom Checkboxes Outline

Add class custom-checkbox-outline & .custom-checkbox-* for a color Checkboxes

Radios

Default Radios
Custom Radios
Custom Radio colors

Add class .custom-radio-* for a color Radios

Custom Radio Outline

Add class custom-radio-outline & .custom-radio-* for a color Checkboxes

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.

Switch examples
Switch sizes

File browser

The file input is the most gnarly of the bunch and requires additional JavaScript if you’d like to hook them up with functional Choose file… and selected file name text.

© Skote.
Design & Develop by Themesbrand