Come creare descrizioni comandi di Bootstrap 5?

La creazione di descrizioni comandi in Bootstrap 5 è un processo semplice che coinvolge HTML, CSS e JavaScript. Segui questi passaggi per aggiungere descrizioni comandi ai tuoi elementi web:

1. Includi Bootstrap:

- Assicurati di includere i file Bootstrap CSS e JavaScript nel tuo codice HTML. Assicurati che i tuoi file JavaScript siano posizionati subito prima del file ` "etichetta".

2. Struttura HTML:

- Aggiungi l'elemento a cui vuoi allegare un tooltip.

- Avvolgi il testo o l'elemento, ad esempio un pulsante, con un tag di ancoraggio "" con attributi HTML specifici.

- All'interno del tag "", includi un attributo "title" che specifica il contenuto del tooltip.

```html

Passa il mouse sopra di me

```

3. Inizializzazione JavaScript:

- Inizializza i suggerimenti utilizzando JavaScript includendo la seguente riga:

```javascript

var tooltipTriggerList =document.querySelectorAll('[data-bs-toggle="tooltip"]');

var tooltipList =[...tooltipTriggerList].map(tooltipTriggerEl => nuovo bootstrap.Tooltip(tooltipTriggerEl));

```

4. Aggiungi configurazione aggiuntiva:

- Specifica il posizionamento del tooltip modificando l'attributo data-placement sul tag "", ad es. `data-placement="top"` per la descrizione comando sopra l'elemento o `data-placement="bottom"`.

Come creare descrizioni comandi di Bootstrap 5?

Informazioni correlate

Articoli consigliati