Ajouter du texte de survol sans JavaScript comme si nous survolions le nom d'un utilisateur

Ajouter Du Texte De Survol Sans Javascript Comme Si Nous Survolions Le Nom D Un Utilisateur



Sur de nombreuses pages Web, nous voyons souvent un texte qui apparaît sur un certain élément lorsque nous le survolons et disparaît lorsque nous déplaçons le curseur ailleurs sur l'écran. Ce texte est appelé texte de survol. En JavaScript, il est facile d'ajouter le texte de survol sur un élément. Mais, il est également possible d'ajouter un texte de survol dans un document HTML en utilisant soit le '
' ou l'élément ' ” élément avec l'attribut title.

Cet article présente deux méthodes utiles pour ajouter un texte de survol en HTML sans utiliser JavaScript :

Méthode 1: Ajouter du texte de survol via l'élément 'div'

Un texte de survol peut être ajouté en utilisant simplement le '

” élément avec le “ titre « attribut dans l'ouverture » ”. Le développeur doit ajouter le texte de survol dans l'attribut 'title' à l'intérieur du '
'balise d'ouverture et l'élément HTML est ajouté entre l'ouverture et la fermeture'
' Mots clés. Le texte à l'intérieur du '
” L'élément conteneur peut être de n'importe quel type. Par exemple, un '

« en-tête »,

” élément de paragraphe, ou un simple texte brut.





Exemple

Écrivons un exemple simple pour ajouter le '

” afin d'ajouter le texte de survol sur un élément HTML :



< div titre = 'Ceci est le texte de survol' > Survolez-moi ! < / div >

Selon le code ci-dessus :



  • UN '
    ” élément a été ajouté avec le “ titre « attribut dans l'ouverture »
    ' étiqueter.
  • Le ' titre ” contient le texte censé être affiché lorsque l'utilisateur passe le curseur de la souris sur le texte.
  • Entre l'ouverture et la fermeture »
    ” tags est le texte qui sera affiché sur l'interface survolée qui affichera le texte de survol.

L'exemple ajouté ci-dessus affichera la sortie suivante :



Méthode 2: Ajouter du texte de survol via l'élément 'span'

Un texte de survol peut également être ajouté en utilisant le ' ” élément en HTML. Tout ce qu'il faut, c'est ajouter le texte de survol dans l'attribut title et l'élément HTML réel pour lequel le texte de survol est ajouté entre l'ouverture et la fermeture ' ' Mots clés.



Exemple

Ajoutons un exemple simple pour insérer le ' ” dans le document HTML dans le but d'ajouter le texte de survol sur un élément HTML :

< portée titre = 'Ceci est le texte de survol' >Survolez-moi !< / portée >

Dans l'exemple ci-dessus :

  • UN ' ” élément a été ajouté avec le “ titre « attribut à l'intérieur de l'ouverture » ' étiqueter.
  • Le ' titre ” contient le texte censé s'afficher lorsque l'utilisateur survole.
  • Entre l'ouverture et la fermeture » ” tags est le texte qui sera affiché à l'utilisateur survolé qui affichera le texte de survol.

Sortir

Ceci résume les méthodes possibles pour ajouter un texte de survol sans utiliser JavaScript.

Conclusion

Un texte de survol peut être facilement ajouté en HTML sans nécessiter l'utilisation de fonctions JavaScript. Le développeur doit utiliser soit le '

' ou l'élément ' ” qui crée l'élément HTML puis ajoute l'attribut title définissant le texte de survol. Cet article est un bon guide sur la méthode pour ajouter le texte de survol sans nécessiter JavaScript.

Autre

Catégorie

Articles Populaires

Comment régler la luminosité de l'écran sous Windows 11

Comment jouer à la Xbox sur un ordinateur portable avec HDMI ?

Comment ajouter un bot dans Discord sans utiliser l'outil tiers

Qu'est-ce que la structure de données en C++

Comment répertorier tous les services en cours d'exécution sous Systemd sous Linux

Comment réparer les erreurs DLL ou les problèmes de fichiers DLL manquants dans Windows 10 et 11

Quel est le fonctionnement de Jasper.ai ?

Comment vérifier la version du noyau sous Linux

Comment utiliser la propriété PowerShell Expand pour Select-Object

Qu'est-ce que la commande Rename-Item dans PowerShell ?

Qu'est-ce que pfp dans Discord ?

Comment étiqueter un composant dans l'interface graphique de MATLAB

Comment télécharger et installer la version complète de WinZip pour Windows 10/11 ?

Comment exécuter ChatGPT sur Raspberry Pi

Comment obtenir Google Chromium pour le Raspberry Pi

Comment changer l'e-mail Discord

Expressions lambda C# LINQ

Qu'est-ce que la méthode Stream.sorted() en Java

Comment réinitialiser une séquence dans PostgreSQL

Fonction vectorielle Push_Back() en C++