Bootstrap-form-demo

ブートストラップ-フォームデモ

フォームレイアウト

ブートストラップは、次のタイプのフォームレイアウトを提供します-

• 垂直（デフォルト）フォーム
• インラインフォーム
• 横型

縦型または基本型

基本的なフォーム構造にはBootstrapが付属しています。個々のフォームコントロールは、グローバルなスタイルを自動的に受け取ります。 基本的なフォームを作成するには、次のようにします-

• ロール_form_を親<form>要素に追加します。
• クラス_.form-group_を使用して、ラベルとコントロールを<div>でラップします。 これは最適な間隔に必要です。
• _.form-control_のクラスをすべてのテキスト<input>、<textarea>、および<select>要素に追加します。

インラインフォーム

すべての要素がインライン、左揃え、ラベルが並んでいるフォームを作成するには、クラス_.form-inline_を<form>タグに追加します。

横型

水平フォームは、マークアップの量だけでなく、フォームの表示においても他のフォームとは異なります。 水平レイアウトを使用するフォームを作成するには、次の操作を行います-

• _.form-horizo​​ntal_のクラスを親の<form>要素に追加します。
• クラス_.form-group_を使用して、ラベルとコントロールを<div>でラップします。
• _.control-label_のクラスをラベルに追加します。

Example	Description	Download link
Login Page	This example indicates about login page structure in Bootstrap	Download
Contact page	This example indicates about Contact page structure in Bootstrap	Download
Sign Up page	This example indicates about Sign Up page structure in Bootstrap	Download