Abgerundete Ecken in CSS: Einfach ohne Bilder - Runde Ecken

Alle lieben abgerundete Ecken. Es gibt viele Möglichkeiten, die Ecken von HTML-Elementen zu runden. Ein paar gängige Techniken sind die folgenden:

Verschachtelte HTML-Elemente mit Bildern für die Ecken
Verschachtelte HTML-Elemente, die per CSS 1 Pixel groß dargestellt und absolut positioniert werden
Javascript, z.B. per jQuery oder Prototype

Der einfachste Weg ist jedoch, die abgerundeten Ecken mit nur zwei Zeilen CSS zu erzeugen:

.rounded-corners {
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}

Da es leider keine einheitliche Angabe für alle Browser gibt, verwenden wir eine Zeile pro Browser-Engine: -moz für Mozilla-Browser wie Firefox und -webkit für Webkit-Browser wie Safari und Google Chrome.

Abgerundete Ecken in CSS einfach

Kommentare