Home » Tutorials » Bootstrap » Forms Bootstrap

Forms Bootstrap

Table in Bootstrap
pivot and unpivot in sql server

Forms Bootstrap

There are three types of Forms Bootstrap:

  1. Vertical Layout
  2. Inline Layout
  3. Horizontal Layout

 

1. Vertical Layout:

This is a basic layout of form. All inputs must be placed within <form> tag. Labels and input controls need to be written in <div> with class “.form-group” applied. “.form-control” class should be applied to inputs.

Example:

OUTPUT:

Vertical-Layout-Forms-BootStrap

Vertical-Layout-Forms-Bootstrap

2. Inline Layout:

All elements’ alignment is inline and from left direction. Apply “.form-inline” class to <form> element.

Apply “.sr-only” class to labels. It will hide them.

Example:

OUTPUT:

Inline-Layout-Forms-BootStrap

Inline-Layout-Forms-Bootstrap

3. Horizontal Layout:

Consider below element, class pair and apply accordingly.
<form> → “.form-horizontal”
<div> → “.form-group”
<label> → “.control-label”

Example:

OUTPUT:

Horizontal-Form-BootStrap

Horizontal-Form-Bootstrap

 

About

Hello friends, My self Dhruv Sheth, I have more than 6 years of Industrial experience as a Software Developer. In my career I got chance to work with asp.net, c#,Web API, JavaScript, JQuery, WPF, WCF , Windows Application, PostScript, vb.net, GhostScript etc. So I have decided to share my knowledge with everyone and finally I have come up with TechnoThirsty.

Leave a Reply

Your email address will not be published. Required fields are marked *

*
*

Time limit is exhausted. Please reload CAPTCHA.




DISCLAIMER:
The content is copyrighted to technothirsty.com and may not be reproduced on other websites without permission from the owner.You may contact us using the information below.