Maison  >  Article  >  interface Web  >  Explication graphique détaillée de la différence entre l'attribut alt et l'attribut title dans la balise

Explication graphique détaillée de la différence entre l'attribut alt et l'attribut title dans la balise

yulia
yuliaoriginal
2018-09-21 17:18:4311703parcourir

Dans la mise en page, des images seront inévitablement utilisées. En parlant d'images, tout le monde devrait être familier avec l'attribut alt et l'attribut title de la balise img. Savez-vous dans quelles circonstances elles sont utilisées ? Cet article vous expliquera la différence entre l'attribut alt et l'attribut title dans la balise img. Les amis intéressés peuvent continuer à lire ci-dessous.

Les similitudes et les différences entre l'attribut alt et l'attribut title

Mêmeness : ils auront tous deux un petit calque flottant pour afficher le contenu lié à l'image

Les différences sont les suivantes suit Afficher les caractéristiques de l'attribut

alt :

① Si l'image n'est pas chargée avec succès et ne peut pas être affichée, un morceau de texte apparaîtra à l'endroit où l'image n'est pas affichée. Cette fonction consiste à fournir des informations sur les images déchargées, facilitant ainsi la navigation des utilisateurs sur les pages Web, ainsi que la maintenance des pages Web par les développeurs.

② Les moteurs de recherche peuvent obtenir des images grâce à la description textuelle de cet attribut

Caractéristiques de l'attribut title :

L'attribut title peut être utilisé sur n'importe quel élément lorsque l'utilisateur. déplacez la souris sur l'élément, le contenu du titre apparaîtra, qui sert de description de l'image. Son essence est une note ou une annotation pour l'image

En termes simples, l'essence de l'attribut alt est. pour remplacer l'image par du texte, et l'essence de l'attribut title est la description ou le commentaire de l'image.

Exemple de démonstration

L'effet de l'attribut alt est le suivant :

<img src="img/frui.jpg" alt="图片未显示出来时,提醒你这是一张图片"/>

Rendu :

Explication graphique détaillée de la différence entre lattribut alt et lattribut title dans la balise <img>

Lorsque l'image ne s'affiche pas normalement, le résultat est tel que montré sur l'image, seul le contenu défini dans alt apparaît. L'effet de l'attribut

title est le suivant :

<img  src="img/fruit.jpg" title="介绍这张图片是创意水果图片"/ alt="Explication graphique détaillée de la différence entre l'attribut alt et l'attribut title dans la balise <img>" >

Rendu :

Explication graphique détaillée de la différence entre lattribut alt et lattribut title dans la balise <img>

Comme le montre l'image, cette image s'affiche normalement lorsque la souris passe l'image, le contenu du titre apparaît pour décrire l'image.

Résumé : peu importe que l'image soit affichée normalement ou non, l'image définit uniquement l'attribut de titre. Lorsque la souris survole l'image, vous pouvez voir la description textuelle de l'image. Lorsque l'image n'a que l'attribut alt défini, vous pouvez passer la souris sur l'image pour voir le texte alternatif de l'attribut alt de l'image. Si l'image a à la fois l'attribut title et l'attribut alt définis, seul l'attribut title de l'image sera affiché lorsque la souris survole. Ce qui précède présente principalement la différence entre l'attribut alt et l'attribut title dans la balise img. J'espère que vous pourrez le comprendre.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn