Heim >Web-Frontend >HTML-Tutorial >HTML-Tag: Zusammenfassung der Verwendung des img-Tags
Der Inhalt dieses Artikels handelt von HTML-Tags: Eine Zusammenfassung der Verwendung von IMG-Tags hat einen gewissen Referenzwert. Ich hoffe, dass er für Sie hilfreich ist.
1. Das Img-Tag hat zwei wichtige Attribute:
1.src-Attribut: die Adresse des Bildes
2.alt-Attribut: das Bild nicht Die Anzeige ist tatsächlicher Text
2. Das Img-Tag ist ein Element auf Zeilenebene:
img und input sind Inline-Ersetzungselemente. Höhe/Breite/Polsterung/Rand sind alle verfügbar. Der Effekt ist gleich dem Blockelement. Inline-Nicht-Ersatzelemente, zum Beispiel Höhe/Breite/Abstand oben, Unten/Rand oben/unten, haben keine Auswirkung. Nur
kann verwendet werden, um die Breite mit Abstand links/rechts und Rand links/rechts zu ändern .
3. Zentrieren Sie das IMG-Tag:
1. Die erste Methode: Diese Methode gefällt mir nicht besonders. Das IMG-Tag kann nicht auf table- gesetzt werden. Zelle. Fehleranfällig.
img_p{ display: table-cell;vertical-align: middle; /*控制图片垂直居中*/ text-align: center; /*控制图片水平居中*/ }
2. Die zweite Methode: Bei dieser Methode ist es am besten, das Margin-Attribut für das Img-Tag nicht zu haben, da es sonst nicht zentriert wird.
img{ position: absolute;top:50%;left: 50%; transform:translate(-50%,-50%); }
4. IMG-Tag-Ereignis:
1. Verwenden Sie das onerror-Ereignis des HTML-DOM-Ereignisobjekts, um Bilder zu verarbeiten, die Ausnahmen anzeigen.
<img src="img/1.jpg" alt="这是一张图片" onerror="alert(this.alt)">
Empfohlene verwandte Artikel:
HTML-Layout: Implementierungscode des dreispaltigen HTML-Layouts
Was ist das innerHTML-Attribut? Verwendung des innerHTML-Attributs
Das obige ist der detaillierte Inhalt vonHTML-Tag: Zusammenfassung der Verwendung des img-Tags. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!