So passen Sie den Abstand zwischen Bildern in HTML an

In HTML können Sie die Attribute „margin-left“ oder „margin-right“ verwenden, um den Abstand zwischen Bildern anzupassen. Sie müssen nur „margin-left: value“ hinzufügen zum Bildelement img; " oder "margin-right: value;"-Stil ist ausreichend.

Die Betriebsumgebung dieses Tutorials: Windows 7-System, HTML5-Version, Dell G3-Computer.

Passen Sie den Abstand zwischen Bildern in HTML an.

Erstellen Sie eine neue HTML-Datei und nennen Sie sie test.html. Erstellen Sie ein div und setzen Sie dessen Klassenattribut auf dd.

Verwenden Sie im div das img-Tag, um zwei Bilder zu erstellen. Die Bildnamen sind 1.jpg bzw. 3.jpg.

Um offensichtliche Effekte zu zeigen, stylen Sie die Div. Stellen Sie die Breite des Divs auf 600 Pixel und die Höhe auf 500 Pixel ein, zentrieren Sie es und legen Sie einen grauen Rand von 1 Pixel fest.

Verwenden Sie in der Datei test.html das Attribut „margin“, um den Abstand zwischen den beiden Bildern festzulegen. Um beispielsweise den Abstand zwischen Bild 1.jpg und Bild 3.jpg auf 30 Pixel festzulegen, können Sie ihn mit dem Attribut „margin-right“ festlegen.

Darüber hinaus können Sie mit „Rand“ auch den oberen, unteren und linken Rand des Bildes festlegen. Sie lauten wie folgt:

• margin-left: linker Rand;

• margin-top: oberer Rand;

• margin-bottom: unterer Rand.

Verwenden Sie beispielsweise margin-left, um den linken Rand von Bild 3.jpg auf 30 Pixel festzulegen, wodurch auch der Effekt des vorherigen Schritts erzielt werden kann.

margin kann auch die Ränder auf den vier Seiten des Bildes gleichzeitig festlegen, in der Reihenfolge „oben, rechts, unten, links“. Stellen Sie beispielsweise die Ränder auf „oben, rechts“ ein „, unten, links“ von Bild 1.jpg auf 10px, 20px, 30px, 40px.

Empfohlenes Tutorial: „HTML-Video-Tutorial“

Das obige ist der detaillierte Inhalt vonSo passen Sie den Abstand zwischen Bildern in HTML an. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!