Das Bild wird nicht einfach direkt in den Text eingefügt. Dem Browser wird sein Name mitgeteilt und er wird angewiesen, wo und wie er ihn auf dem Bildschirm positionieren soll. Verwenden Sie dazu ein einzelnes HTML-img-Tag. Es gibt die Position des Grafikobjekts auf der Webseite an.
Wenn viele Attribute für Tags optional sind, muss das img-Tag mindestens einen Parameter haben - die Adresse des Bildes. Dieses Attribut heißt src:
- - Dies zeigt die im aktuellen Verzeichnis gespeicherte Datei "goat.jpg" an;
- - Mit diesem Parameter des img-Tags lädt der Browser das im Internet auf der Website megasellmag.ru veröffentlichte Bild.
Ausrichtungsattribute
Um Bilder mithilfe von HTML auf einer Seite zu positionieren, wird das img-Tag verwendet, dessen Attribute für die Platzierung des Bildes auf der Seite und die Art des Textumbruchs verantwortlich sind.
Standardmäßig platziert der Browser das Bild in der Mitte des Bildschirms, und der Text wird nicht darum herumgeführt. Mit dem img-Tag können Sie Ihren Widerspruch zum Browser mithilfe des Attributs align (Ausrichtung) ausdrücken.
- das Bild wird am linken Rand der Seite positioniert und der Text wird rechts darum herum laufen.
Das Verh alten des Textes ist ähnlich, wenn das Bild rechts (align=right), in der Mitte (align=middle), oben (align=top), unten platziert wird(align=bottom) und center (center).
Einstellungen und Größen
Um zu verhindern, dass Text in Bilder eindringt, hat das img-Tag die speziellen Attribute -hspace (horizontale/horizontale Ränder) und vspace (vertikale/vertikale Ränder) erh alten, die den Betrag des Texteinzugs von den Rändern der Bilder bestimmen Pixel.
Das Bild bewegt sich nicht nur gehorsam um den angegebenen Betrag vom Text weg, sondern auch vom Rand der Seite, daher ist es am besten, große Einzüge zu vermeiden.
Die geometrischen Abmessungen von Bildern sind sehr wichtig, die nicht nur wünschenswert, sondern manchmal auch einfach notwendig sind, um das Bild korrekt darzustellen. Dazu werden die Attribute width (Breite) und height (Höhe) verwendet, deren Wert in Pixeln oder Prozent angegeben wird.
Wenn Sie nur die Breite angeben, wird die Höhe automatisch mit den ursprünglichen Proportionen ausgewählt. Die prozentuale Größe ermöglicht es Ihnen, das Bild unabhängig von der Größe des Browserfensters im rechten Teil der Seite zu platzieren, was häufig erforderlich ist.
Andere Optionen
Das border-Attribut umschließt das Bild mit einem Rahmen der angegebenen Dicke, was der Browser standardmäßig nicht tut.
Der Rand kann auch eine scheinbar bedeutungslose Breite von Null haben (Rand='0'), aber das ist so lange, bis das Bild zu einem Link wird, wenn der Browser es automatisch mit einem blauen Rand einkreist, ohne auf Anweisungen zu warten.
Einige ungeduldige Benutzer, die sich über niedrige Internetgeschwindigkeiten ärgern, deaktivieren einfach die Anzeige von Bildern. Für solche Fälle wird der Alt-Parameter bereitgestellt, der Ihnen die Eingabe ermöglicht alternativer Text, den der Benutzer in dem Feld sieht, in dem das Bild es eilig hat, geladen zu werden.
Wenn Ihnen die Möglichkeiten des alt-Parameters nicht gefallen, kann das img-Tag ein longdesc-Attribut anbieten, dessen Wert die URL eines Dokuments mit einer genaueren Beschreibung ist.
Die usemap- und ismap-Attribute teilen dem Browser mit, dass das Bild ein Bild sein wird, in dem die Hyperlinks separate Bereiche sind (link map), nur der usemap-Parameter bestimmt die Navigationskarte auf dem Server und ismap - die Karte darauf die Client-Seite.
Beschreibung von Link 1 in der Abbildung unten:
Exotische Artikel
Das Attribut lowsrc weist den Browser an, zuerst eine Kopie (oder eine andere Alternative) des Originalbildes mit geringerer Qualität und daher "heller" herunterzuladen. Dieser Trick wird im Falle einer niedrigen Internetgeschwindigkeit für den Benutzer bereitgestellt. Das Originalbild ersetzt nach dem Hochladen das "Fake".
Das weniger häufig verwendete Attribut galleryimg des img-Tags ruft das Bildsteuerungsfeld auf (wenn es mit der Maus darüber bewegt wird), mit dem Sie den Standardordner Meine Bilder öffnen und das Bild drucken, speichern oder per E-Mail versenden können. Sie können das Panel deaktivieren, indem Sie den Parameter galleryimg auf no/false setzen, und es aktivieren, indem Sie yes/true setzen.
In der neuen HTML5-Spezifikation sind bei einer Reihe von Tags einige Parameter ver altet. Beispielsweise wurden die Attribute lowsrc, border, longdesc und name von img entfernt.