Ajouter du texte de survol en HTML

Subodh Poudel 19 février 2023
  1. Utilisez l’attribut title pour ajouter un texte de survol en HTML
  2. Utilisez l’attribut title avec la balise abbr pour ajouter un texte de survol en HTML
Ajouter du texte de survol en HTML

Dans cet article, nous discuterons de quelques façons d’ajouter un texte de survol en HTML. Un texte de survol est un texte d’info-bulle qui apparaît lorsque nous survolons un texte en HTML.

Utilisez l’attribut title pour ajouter un texte de survol en HTML

Nous pouvons utiliser l’attribut title pour ajouter un texte de survol en HTML. L’attribut peut être utilisé avec n’importe quel élément HTML.

Il donne des informations supplémentaires sur l’élément. Lorsque nous utilisons l’attribut title sur un élément, il crée un texte d’info-bulle ou un texte de survol lorsque nous passons la souris sur l’élément.

Par exemple, créez un bouton Login avec la balise <button>. Écrivez un attribut title dans la balise <button>.

Ensuite, écrivez le texte this is a login button comme valeur pour l’attribut title.

Lorsque nous passons la souris sur le bouton, un texte de survol indique this is a login button. Ici, nous avons implémenté l’attribut title avec un bouton, un élément inline.

De cette façon, nous pouvons utiliser l’attribut title pour ajouter un texte de survol en HTML.

Exemple de code :

<button title="this is a login button">
  Login
</button>

Utilisez l’attribut title avec la balise abbr pour ajouter un texte de survol en HTML

Cette méthode explique comment nous pouvons utiliser la balise title pour ajouter du texte de survol tout en utilisant la balise abbr. L’attribut title et abbr sont généralement utilisés ensemble.

La balise abbr est utilisée pour écrire l’abréviation, et la balise title est utilisée pour afficher la forme complète de l’abréviation lors du survol de la souris.

Par exemple, considérez la phrase The Undertaker is a WWE superstar. Enveloppez le mot WWE avec la balise abbr.

Dans le tag, écrivez l’attribut title et donnez-lui la valeur World Wrestling Entertainment.

En conséquence, le mot WWE apparaît avec un soulignement en pointillé. Lorsque nous le survolons, un texte de survol apparaîtra indiquant World Wrestling Entertainment.

Ainsi, c’est ainsi que nous pouvons utiliser l’attribut title avec la balise abbr pour créer un texte de survol en HTML.

Exemple de code :

The Undertaker is a <abbr title="World Wrestling Entertainment"> WWE </abbr> superstar.
Subodh Poudel avatar Subodh Poudel avatar

Subodh is a proactive software engineer, specialized in fintech industry and a writer who loves to express his software development learnings and set of skills through blogs and articles.

LinkedIn