balise d'image HTML-tutoriel HTML-php.cn

balise d'image HTML

无忌哥哥

Libérer： 2018-06-29 09:58:54

original

2130 Les gens l'ont consulté

Les balises d'image sont probablement les plus grandes et les plus intéressantes. Comme le dit le proverbe, une image vaut mille mots

Avec des images dans la page, elle deviendra instantanément colorée. ce qui améliore instantanément l'expérience utilisateur

Cependant, les images sont des ressources externes et il faut du temps pour les charger dans la page actuelle, donc même si les images sont bonnes, on ne peut pas en abuser

Utilisez-les bien et ajoutez la touche finale Non, c'est superflu

Les images utilisent la balise , qui a été mentionnée dans le cours d'expérience front-end précédent

Parce que les images sont des ressources externes, si le les ressources que vous référencez proviennent d'Internet, il est possible que la référence échoue ou que le chargement échoue en raison d'un délai d'attente et d'autres raisons,

Par conséquent, nous devons également ajouter l'attribut alt à la balise img pour indiquer le texte description de l'image actuelle, par exemple : Modèle de voiture hybride

Si l'image actuelle ne peut pas être affichée ou si l'utilisateur interdit l'affichage de l'image, ce texte d'invite

sera affiché. est très important. Comme nous venons de le présenter, les moteurs de recherche ne peuvent pas reconnaître le contenu des images, donc si vous souhaitez que les moteurs de recherche, par exemple Baidu

Si vous savez quelle est votre image, vous devez ajouter une balise alt, afin que votre image. les informations seront récupérées, ce qui est bénéfique à l'optimisation du site

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>6.图像标签</title>
</head>
<body>
<!-- <img src="../images/9.jpg"> -->
<!-- 发现图片太大了,我们刚才介绍过,img标签还有二个属性可以设置图片的大小 -->
<!-- width:设置宽度, height:设置高度,单位默认为像素,可以不写单位,只有数值 -->
<!-- <img src="../images/9.jpg" width="300px"> -->
<!-- <img src="../images/9.jpg" width="300"> -->
<!-- 宽度与高度写一个就可以,另一个属性会自动等比例缩放的 -->
<img src="../images/9.jpg" width="300" alt="混血车模">
</body>
</html>

Copier après la connexion

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!