Heim >Web-Frontend >CSS-Tutorial >Wie zentriere ich ein Bild horizontal innerhalb eines Div?

Wie zentriere ich ein Bild horizontal innerhalb eines Div?

Susan Sarandon
Susan SarandonOriginal
2024-12-22 15:59:15473Durchsuche

How to Horizontally Center an Image Inside a Div?

Horizontales Ausrichten eines Bildes innerhalb eines Div-Containers

Frage:

Wie erreicht man eine horizontale Ausrichtung? Ausrichtung für ein Bild, das sich in einem Div-Container befindet Element?

Details:

Der bereitgestellte HTML- und CSS-Code enthält die notwendige Struktur für die Container- und Bildelemente, das Bild bleibt jedoch unzentriert.

Lösung:

Um das Bild effektiv horizontal zu zentrieren, wenden Sie die folgende CSS-Regel an Bild:

#artiststhumbnail a img {
    display:block;
    margin:auto;
}

Diese Anpassung stellt sicher, dass das Bild als Blockelement angezeigt wird, wodurch die Randanwendung ermöglicht wird. Anschließend weist die automatische Randeinstellung den Browser an, automatisch gleiche linke und rechte Ränder zu berechnen und anzuwenden und so das Bild zu zentrieren.

Visuelle Bestätigung:

Zur Demonstration dieser Lösung , besuchen Sie: http://jsfiddle.net/marvo/3k3CC/2/

Das obige ist der detaillierte Inhalt vonWie zentriere ich ein Bild horizontal innerhalb eines Div?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:Deckkraft vs. CSS-FilterNächster Artikel:Deckkraft vs. CSS-Filter