Bootstrap Form

Introduction

• Form
• CheckBox
• Horizontal form
• Inline form
• Input element style
• RadioButton

Basic

• Input groups
• Button control group
• Checkboxes and radio buttons
• Buttons with dropdowns
• Form control states
• Disabled inputs
• Control sizing
• Form Select Box
• Static text in horizontal forms
• Textarea
• Validation states

Example

• Add focus class to form control
• Add form control add-on
• Control input width with input addon
• Create input-append
• Create round text input
• Create text input with full width minus button width
• Disable Input
• Mark Block Help Text
• Mark Forms Validation States
• Mark Text for Formatting
• Mark control label
• Mark form input field as has-error
• Mark input element with form control class
• Mark label element with control-label
• Prepended and Appended Inputs
• Put form control in nav bar
• Set width for input addon
• Show popup for focused text input
• Style fieldset
• Style select element

Icon

• Align icon inside text input
• Change cursor icon for readonly input
• Put Glyphicon Inside Input Box
• Put both icon and feedback text in text input
• Use entity reference to add icon to form input and button
• Validate Form Glyphicons

Layout

• Align label and control in same line
• Clear fix to start new line
• Create Horizontal Form
• Grid Sizing Form Controls
• Height Sizing Form Controls
• Layout form control with span3
• Layout form in Panel
• Layout form label and control with col-lg-2 and col-lg-10
• Mark Horizontal Form Layout

Login

• Center Login Form
• Create login form

Size

• Control the input text box size

Group

• Create Large input group
• Create Multiple Input Field Group
• Create input group
• Create input-group-addon
• Mark control group
• Mark form button group
• Mark input group addon
• Mark span as input-group-addon
• Prepended and Appended Inputs with input-group-addon
• Pull Input group to right
• Set width for input-group-addon

Radio

• Create Radio Buttons
• Style radio button

Search

• Create Search input form
• Create button with rounded corners with form-search
• Search form layout

Vertical

• Create Vertical form layout
• Create a vertical form
• Create vertical form

Inline

• Create fluid inline form
• Create inline form
• Create inline form layout
• Put form group inside inline form

Checkbox

• Place checkbox or radio option within an input group
• Style checkBox