Bootstrap Block Aiuta esempi di testo

Bootstrap Block Aiuta esempi di testo
Durante la creazione di qualsiasi applicazione, gli sviluppatori cercano sempre di renderlo intuitivo. Più specificamente, i siti Web intuitivi hanno molti fattori, tra cui una navigazione efficace, compatibilità del dispositivo, gestione degli errori, ecc. Ad esempio, l'aggiunta del testo di aiuto con vari componenti è una di queste funzionalità che aiuta l'utente nel processo di aggiunta del testo nei campi di input.

Questo post ti guiderà sugli esempi di testo per la guida del blocco in bootstrap.

Cos'è Bootstrap Block Help Testo?

Il testo del blocco bootstrap può essere creato utilizzando ".form-text" classe. Nella versione Bootstrap 3, il “help-block"La classe è stata utilizzata per aggiungere il testo di aiuto.

Tipi di bootstrap block help text

Questi tipi di elementi arruolati possono essere utilizzati per specificare il testo di aiuto:

  • Blocca elementi
  • Elemento inline

Come aggiungere il blocco bootstrap Aiuta il testo usando gli elementi di blocco?

Gli elementi a livello di blocco, come "","

", O più, può essere utilizzato per aggiungere il testo. A tale scopo, il "form-text"La classe viene utilizzata. Questa classe ha il "blocco di visualizzazione" proprietà. Inoltre, contiene anche la proprietà del margine superiore che aiuta il testo a visualizzare in un certo spazio da altri campi di input.

Esempio

Dai un'occhiata all'esempio seguente:

  • Aggiungi il ""Elemento per creare un modulo.
  • Per includere una didascalia nel campo di input, aggiungi un ""Elemento.
  • Dopodiché, aggiungi il ""Elemento con il"forma di controllo" E "Campo di inserimento"Per creare un campo di input.
  • Quindi, aggiungi il ""Elemento con le classi"form-text" E "Mieto di testo"Per aggiungere un testo di aiuto:

Inserire la password

La tua password deve essere lunga 8 caratteri.

Le classi utilizzate nello snippet di codice sopra sono descritte qui:

  • "forma di controllo"La classe contiene uno stile globale per gli elementi di input.
  • "form-text"La classe aggiunge stili al testo di aiuto.
  • "Mieto di testo"Aggiunge stili generali al testo di aiuto.

Produzione

Come aggiungere il blocco bootstrap aiuta il testo usando elementi in linea?

Gli elementi in linea come "" O ""Può essere utilizzato per aggiungere il testo di aiuto alla pagina web.

Esempio

L'esempio seguente dimostra l'uso del ""Elemento inline per specificare il testo di aiuto:



Inserisci il tuo nome

Deve essere riempito.

Si può osservare che il testo di aiuto è stato aggiunto con successo:

Questo è tutto incentrato sul testo del blocco bootstrap.

Conclusione

Per aggiungere aiuto al testo in bootstrap, il "form-text"La classe viene utilizzata per aggiungere il testo della guida a livello di blocco. IL "Mieto di testo"La classe viene utilizzata per creare testi di aiuto in linea. In Bootstrap 3, il "help-block"La classe viene utilizzata. Più specificamente, il testo di aiuto può essere specificato con gli elementi in linea o a livello di blocco. Questo post ha spiegato come aggiungere il testo di aiuto in bootstrap con l'aiuto di esempi.