Maison > interface Web > tutoriel HTML > Balise HTML : résumé de l'utilisation de la balise img

Balise HTML : résumé de l'utilisation de la balise img

不言
Libérer: 2018-08-08 09:38:33
original
4582 Les gens l'ont consulté

Le contenu de cet article concerne les balises HTML : un résumé de l'utilisation des balises img. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

1. La balise Img a deux attributs importants :

Attribut 1.src : l'adresse de l'image

Attribut 2.alt : l' l'image ne le fait pas L'affichage est le texte réel

2. La balise Img est un élément de niveau ligne :

img et input sont des éléments de remplacement en ligne. hauteur/largeur/remplissage/marge sont tous disponibles. L'effet est égal à l'élément de bloc. Les éléments en ligne non remplaçables, par exemple hauteur/largeur/remplissage haut, bas/marge haut/bas, n'ont aucun effet. Seuls

peuvent être utilisés pour modifier la largeur avec le remplissage gauche/droite et la marge gauche/droite. .

3. Centrez la balise Img :

1. La première méthode : je n'aime pas beaucoup cette méthode. La balise Img ne peut pas être définie sur table-. cellule. Sujet aux erreurs.

img_p{
        display: table-cell;vertical-align: middle;  /*控制图片垂直居中*/
        text-align: center;  /*控制图片水平居中*/      }
Copier après la connexion

2. La deuxième méthode : Dans cette méthode, il est préférable de ne pas avoir l'attribut margin pour la balise Img, sinon elle ne sera pas centrée.

img{
    position: absolute;top:50%;left: 50%;
    transform:translate(-50%,-50%);    
}
Copier après la connexion

4. Événement de balise Img :

1. Utilisez l'événement onerror de l'objet HTML DOM Event pour traiter les images qui affichent des exceptions.

<img src="img/1.jpg" alt="这是一张图片" onerror="alert(this.alt)">
Copier après la connexion

Articles connexes recommandés :

Mise en page HTML : code d'implémentation de la mise en page HTML à trois colonnes

Qu'est-ce que l'attribut innerHTML ? Utilisation de l'attribut innerHTML

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal