HTML Bildgröße einstellen
Was meinen wir mit der Anpassung der Bildgröße in HTML?
Die Größe eines Bildes ist eine Kombination aus Größe und Breite. Wenn wir beispielsweise ein Bild mit einer Größe von 100 x 100 haben, bedeutet dies, dass das genannte Bild eine Höhe und Breite von 100 Pixel hat. Durch Anpassung der Größe eines Bildes in HTML bedeuten wir buchstäblich die Höhe und Breite dieses Bildes entsprechend unseren Anforderungen. Darüber hinaus ist es auch nicht obligatorisch, dass ein Bild die gleiche Breite und Größe hat. Mit anderen Worten, es ist völlig normal, dass ein Bild eine andere Höhe und Breite hat. Lassen Sie uns nun die Methoden zur Anpassung der Größe eines Bildes in HTML lernen.
So stellen Sie die Bildgröße in HTML an?
Sie können die Größe Ihrer gewünschten Bilder in HTML einfach anpassen, indem Sie einer der beiden unten erläuterten Methoden folgen. Bevor wir uns jedoch mit diesen Methoden vorwärts bewegen, möchten wir Ihnen das Bild zeigen, dessen Größe wir mit diesen Methoden anpassen möchten. Dieses Bild ist wie folgt:
Die ursprüngliche Größe dieses Bildes beträgt 900 x 900, ich.e., Die Höhe sowie die Breite dieses Bildes beträgt 900 Pixel, wie im Bild unten hervorgehoben:
Methode Nr. 1: Durch die Verwendung der einfachen Höhe und der Breite von HTML
Bei dieser Methode werden wir die einfachen Höhe und Breiteneigenschaften von HTML verwenden, um die Größe unseres angegebenen Bildes anzupassen. Sie können diesen Eigenschaften einen beliebigen Wert Ihrer Wahl zuweisen. Das HTML -Skript für diese Methode lautet wie folgt:
In dieser Methode liegt unser Hauptaugenmerk auf der Anpassung der Bildgröße, für die wir das „IMG“ -attribut von HTML verwendet haben. Dieses Attribut wird verwendet, wenn Sie mit Bildern in HTML herumspielen möchten. Dann haben wir das "SRC" -attribut verwendet, wobei wir uns auf den genauen Pfad oder den Ort beziehen, an dem sich unser Zielbild befindet. Sie können sehen, dass wir nach diesem Attribut den vollständigen Pfad unseres gewünschten Bildes erwähnt haben. Anschließend haben wir das "Alt" -attribut, das einen alternativen Text für die Beschreibung des Bildes gibt. Sie dürfen dieses Attribut total überspringen. Darauf folgen die Eigenschaften von „Breite“ und „Höhe“ von HTML. Wir haben die Werte dieser beiden Eigenschaften als „400“ beibehalten. Dies bedeutet, dass dieses Skript unser Zielbild in einer reduzierten Größe bei der Ausführung anzeigt.
Auf der im Bild unten gezeigten Webseite werden unser Bild in Größe 400 x 400 angezeigt.
Methode Nr. 2: Durch die Verwendung des Style -Attributs von HTML
Dies ist nur eine alternative Methode, um die Größe eines Bildes in HTML anzupassen. Es verwendet das Inline -Style -Attribut von HTML. Um diese Methode zu verwenden, müssen Sie sich das folgende HTML -Skript ansehen:
Dieses HTML -Skript ähnelt dem, den wir oben in unserer ersten Methode oben besprochen haben. Anstatt einfach die Werte der HTML -Eigenschaften „Höhe“ und „Breite“ anzugeben, haben wir jedoch das Attribut „Stil“ verwendet, und dann haben wir diese Eigenschaften in ihr beigefügt. Diesmal möchten wir die Größe unseres Zielbildes auf 600 x 600 ändern.
Unser angegebenes Bild mit der neu angepassten Größe ist im folgenden Bild angezeigt:
Abschluss
Dieses Tutorial wurde entwickelt, um Sie über die Methoden zur Anpassung der Bildgröße in HTML zu führen. In dieser Hinsicht haben wir Ihnen zwei verschiedene Methoden geteilt, die wirklich einfach zu implementieren sind. Nachdem Sie diese beiden Methoden durchlaufen haben, werden Sie es nicht schwierig finden, die Größen Ihrer Bilder anzupassen, ich.e., Erhöhen oder verringern Sie die Bildgröße entsprechend Ihren Anforderungen, während Sie mit HTML arbeiten.