HTML ermöglicht es uns, Bilder in Webseiten zu verwenden und sie ansprechender zu gestalten, indem wir verschiedene Stile anwenden. Wenn Sie das Seitenverhältnis des Bildes ändern müssen oder Ihr Bild nicht in das Layout Ihrer Webseite passt, können Sie die Größe ändern. Zu diesem Zweck können Sie das „ Breite ' und ' Höhe ” Eigenschaften auf der “ Bild ' Schild. Diese Eigenschaftswerte können einfach in CSS-Pixeln festgelegt werden.

In diesem Handbuch lernen Sie die Methode zum Ändern der Bildgröße in HTML kennen.

Vor dem Start muss das Bild der HTML-Datei hinzugefügt werden, für die die Größenänderung des Bildes durchgeführt wird.

Wie bettet man ein Bild in HTML ein?

Um ein Bild in HTML hinzuzufügen, verwenden Sie die folgende Syntax:

Die Beschreibung der oben erwähnten Syntax wird unten beschrieben. Das ' Bild ”-Tag verwendet zwei Attribute:

• • „src“ wird verwendet, um den Pfad (URL) des Bildes bereitzustellen.
  • 'alles' wird verwendet, um den alternativen Text bereitzustellen, wenn das Bild nicht angezeigt wird.

HTML

Der folgende Code repräsentiert zwei Divs. Im ersten Div haben wir oben in der Mitte unserer Webseite eine Überschrift als „ Bildgröße in HTML “ unter Verwendung des

-Tags:

< div >
< Center >
< h1 > Bildgröße in HTML h1 >
Center >
div >

Das zweite div wird mit der Klasse namens „ Container “ und um das Bild in der Mitte darzustellen, haben wir das Tag

verwendet. Schreiben Sie in die Mitte den unten genannten Code, um ein Bild hinzuzufügen:

< div Klasse = 'Container' >
< Center >
< Bild Quelle = 'bilder/schmetterling.jpg' alles = 'Alternativer Text' >
Center >
div >

Das ausgewählte Bild mit „ 640*437 ” Seitenverhältnis sieht so aus:

Im nächsten Abschnitt wird die Methode zum Ändern der Größe eines Bildes demonstriert.

Wie verkleinere ich das Bild in HTML?

Sie können die Größe des Bildes anpassen oder die Größe ändern, indem Sie „ Breite ' und ' Höhe ”-Attribute, um seine Breite und Höhe festzulegen.

Lassen Sie uns nun den Breitenwert des hinzugefügten Bildes als „ 300 “ und sehen Sie, wie es funktioniert:

< Bild Quelle = 'bilder/schmetterling.jpg' alles = 'Alternativer Text' Breite = '300' >

Es ist ersichtlich, dass die Bildbreite geändert wurde und die Größe erfolgreich geändert wurde:

Neben der Breite ist das „ Höhe ”-Attribut kann auch für den gleichen Zweck verwendet werden. Um den Größenunterschied anzuzeigen, stellen Sie „ 550 ” Pixel als Bildhöhe:

< Bild Quelle = 'bilder/schmetterling.jpg' alles = 'Alternativer Text' Breite = '300' Höhe = '550' >

Sie können den Unterschied in der Bildgröße deutlich beobachten:

So werden Breiten- und Höhenattribute verwendet, um die Größe des Bildes zu ändern.

Fazit

In HTML ist das „ Höhe ' und ' Breite ”-Attribute werden zum Ändern der Bildgröße verwendet. Sie können das Standard-Seitenverhältnis des hinzugefügten Bildes ändern, indem Sie die Werte dieser Attribute festlegen. Dadurch ist ein deutlicher Unterschied bezüglich der Bildgröße zu erkennen. Dieser Blog hat die Methode zur Verwendung von Höhen- und Gewichtseigenschaften zum Ändern der Größe von Bildern in HTML demonstriert.