COMPONENTI BOOTSTRAP
BUTTON
Bootstrap 5 fornisce diversi stili di pulsanti. Le classi di pulsanti possono essere utilizzate su elementi
<a>, <button> o <input>.
BUTTON OUTLINE
Bootstrap 5 fornisce anche otto pulsanti con bordi. Sposta il mouse su di essi per vedere un ulteriore effetto “hover“.
BUTTON SIZE
Usa la classe .btn-lg per pulsanti grandi o la classe .btn-sm per pulsanti piccoli:
<button type=”button” class=”btn btn-primary btn-lg”>Large</button>
<button type=”button” class=”btn btn-primary”>Default</button>
<button type=”button” class=”btn btn-primary btn-sm”>Small</button>
BLOCK LEVEL BUTTON
Per creare un pulsante a livello di blocco che copre l’intera larghezza dell’elemento padre, utilizzare la classe “helper” .d-grid sull’elemento padre.
ACTIVE/DISABLED BUTTON
Un pulsante può essere impostato su uno stato attivo (appare premuto) o disabilitato (non cliccabile): La classe .active fa apparire un pulsante premuto e l’attributo disabled rende un pulsante non cliccabile. Si noti che gli elementi <a> non supportano l’attributo disabilitato e devono quindi utilizzare la classe .disabled per farlo apparire visivamente disabilitato.
BUTTON GROUP
Bootstrap 5 ti consente di raggruppare una serie di pulsanti (su una singola riga).
Suggerimento: invece di applicare le dimensioni dei pulsanti a ogni pulsante di un gruppo, utilizzare la classe .btn-group-lg per un gruppo di pulsanti di grandi dimensioni o .btn-group-sm per un gruppo di pulsanti piccolo:
VERTICAL BUTTON GROUP
Usa la classe .btn-group-vertical per creare un gruppo di pulsanti verticale.
NIDIFICAZIONE DI GRUPPI DI PULSANTI E MENU A DISCESA
Annida i gruppi di pulsanti per creare menu a discesa (scoprirai di più sui menu a discesa in un post successivo).
JUMBOTRON
Jumbotron è stato introdotto in Bootstrap 3 come una grande scatola imbottita per richiamare l’attenzione su alcuni contenuti o informazioni speciali. I jumbotron non sono più supportati in Bootstrap 5. Tuttavia, puoi utilizzare un elemento <div> e aggiungere classi helper speciali insieme a una classe colore per ottenere lo stesso effetto.
Scrivi un commento