Bootstrap -Blockhilfe -Textbeispiele

Während der Erstellung einer Anwendung versuchen die Entwickler immer, sie benutzerfreundlich zu machen. Insbesondere haben benutzerfreundliche Websites viele Faktoren, einschließlich effektiver Navigation, Gerätekompatibilität, Fehlerbehandlung usw. Zum Beispiel ist das Hinzufügen von Hilfentext mit verschiedenen Komponenten eine solche Funktion, die dem Benutzer beim Hinzufügen von Text in die Eingabefelder hilft.

In diesem Beitrag führen Sie die Beispiele für Blockhilfe -Text in Bootstrap.

Was ist Bootstrap -Blockhilfe -Text?

Der Bootstrap -Block -Hilfegtext kann mit der “erstellt werden.Formtext" Klasse. In der Bootstrap 3 -Version die “HilfestlockDie Klasse wurde verwendet, um Hilfetext hinzuzufügen.

Arten von Bootstrap -Blockhilfe Text

Diese eingetragenen Elementtypen können verwendet werden, um den Hilfegtext anzugeben:

• Blockelemente
• Inline -Element

So fügen Sie Bootstrap -Blockhilfe -Text mit Blockelementen hinzu?

Die Elemente auf Blockebene wie "","

”Oder mehr kann verwendet werden, um Hilfetext hinzuzufügen. Zu diesem Zweck die “Formtext”Klasse wird verwendet. Diese Klasse hat das "Bildschirmsperre" Eigentum. Darüber hinaus enthält es auch die Top -Margin -Eigenschaft, die dem Text hilft.

Beispiel

Schauen Sie sich das folgende Beispiel an:

• Ergänzen Sie die "Element zum Erstellen einer Form.
• Um eine Bildunterschrift in das Eingangsfeld einzubeziehen, fügen Sie eine hinzu "" Element.
• Danach fügen Sie die "hinzu"”Element mit dem“Formkontrolle" Und "Eingabefeld”Um ein Eingabefeld zu erstellen.
• Dann fügen Sie das hinzu “"Element mit den Klassen"Formtext" Und "Text-MUTE”Um einen Hilfetext hinzuzufügen:

Passwort eingeben

Ihr Passwort muss 8 Zeichen lang sein.

Die im obigen Code -Snippet verwendeten Klassen werden hier beschrieben:

• “FormkontrolleDie Klasse enthält ein globales Styling für die Eingabeelemente.
• “FormtextDie Klasse fügt dem Hilfstext Stile hinzu.
• “Text-MUTE”Fügt dem Hilfstext allgemeine Stile hinzu.

Ausgang

So fügen Sie Bootstrap -Blockhilfe -Text mit Inline -Elementen hinzu?

Die Inline -Elemente wie "" oder "Kann verwendet werden, um der Webseite Hilfetext hinzuzufügen.

Beispiel

Das folgende Beispiel zeigt die Verwendung der “”Inline -Element, um den Hilfetext anzugeben:

Gib deinen Namen ein

Muss ausgefüllt sein.

Es kann beobachtet werden, dass der Hilfstext erfolgreich hinzugefügt wurde:

Hier geht es um den Bootstrap -Blockhilfe -Text.

Abschluss

Um Hilfe in Bootstrap hinzuzufügen, die “, die“FormtextDie Klasse wird verwendet, um den Hilfstext auf Blockebene hinzuzufügen. Der "Text-MUTEDie Klasse wird verwendet, um Inline -Hilfe -Text zu erstellen. In Bootstrap 3 die “Hilfestlock”Klasse wird verwendet. Insbesondere kann der Hilfstext mit den Elementen inline- oder Blockebene angegeben werden. In diesem Beitrag wurde erklärt, wie man mit Hilfe von Beispielen Hilfe -Text in Bootstrap hinzufügt.