Der Internetfinder - DIE Antwortseite! - Wie kann ich in HTML mit CSS ein Image bzw. img kreisförmig bzw. rund anzeigen?

Wie kann ich in HTML mit CSS ein Image bzw. img kreisförmig bzw. rund anzeigen?

~ 0 min

Christian Steiner

2020-09-25 12:26

Wenn Sie in HTML mit CSS ein Bild als Kreis oder mit abgerundeten Ecken anzeigen möchten, gehen Sie wie unten beschrieben vor.
Verwenden Sie hier für die CSS-Eigenschaft border-radius und setzen Sie diese auf 50%;.

Beispiel:

<!-- HTML-Code: -->

<img src="image.jpg" alt="Beispielbild"> 


/* CSS-Code: */

img {
  border-radius: 50%;
}

Wenn Sie lediglich die Ecken des Images etwas abrunden möchten, verringern Sie den Wert von border-radius einfach etwas (z.B. auf 10%).