Bootstrap ブロックのヘルプ テキストの例

」、「

」、またはそれ以上を使用して、ヘルプ テキストを追加できます。この目的のために、「 フォームテキスト 」クラスが使用されます。このクラスには「 表示ブロック ' 財産。さらに、テキストを他の入力フィールドからいくらか離して表示するのに役立つ top margin プロパティも含まれています。

例

以下の例をご覧ください。

---

---

• 「」を追加 <フォーム> 」要素を使用してフォームを作成します。
• 入力フィールドにキャプションを含めるには、「 <スパン> ' エレメント。
• その後、「 <入力> ” 要素 フォームコントロール ' と ' 入力フィールド 」をクリックして入力フィールドを作成します。
• 次に、「 <小> ” クラスを持つ要素 “ フォームテキスト ' と ' テキストミュート 」を使用してヘルプ テキストを追加します。

< 形 >

< スパン > パスワードを入力する < / スパン >

< 入力 クラス = 「フォームコントロール入力フィールド」 タイプ = 'パスワード' >

< 分周 クラス = 「フォームテキストテキストミュート」 > パスワードは 8 文字である必要があります。 < / 分周 >

< / 形 >

上記のコード スニペットで使用されているクラスは次のとおりです。

• 「 フォームコントロール 」 クラスには、入力要素のグローバル スタイル設定が含まれています。
• 「 フォームテキスト 」 クラスは、ヘルプ テキストにスタイルを追加します。
• 「 テキストミュート 」は、ヘルプ テキストに一般的なスタイルを追加します。

出力

インライン要素を使用して Bootstrap ブロックのヘルプ テキストを追加する方法

「」などのインライン要素 <スパン> ' また ' <小> 」を使用して、Web ページにヘルプ テキストを追加できます。

例

以下の例は、「 <小> ヘルプ テキストを指定するインライン要素:

< 形 クラス = 「フォームインライン」 >

< 分周 クラス = 「フォームグループ」 >

< スパン >あなたの名前を入力してください< / スパン >

< 入力 クラス = 「フォームコントロール入力フィールド」 タイプ = 'パスワード' >

< 小さな クラス = 「テキストミュート」 >入力する必要があります。< / 小さな >

< / 分周 >

< / 形 >

ヘルプ テキストが正常に追加されたことを確認できます。

これはすべて、Bootstrap ブロックのヘルプ テキストに関するものです。

結論

Bootstrap にヘルプ テキストを追加するには、「 フォームテキスト 」 クラスを使用して、ブロック レベルのヘルプ テキストを追加します。 「 テキストミュート 」クラスを使用して、インライン ヘルプ テキストを作成します。 Bootstrap 3 では、「 ヘルプブロック 」クラスが使用されます。より具体的には、ヘルプ テキストはインライン要素またはブロック レベル要素で指定できます。この投稿では、例を使用して Bootstrap にヘルプ テキストを追加する方法を説明しました。