Das Anwesen border-radius ermöglicht Web-Entwicklern mit CSS3 abgerundete Ecken in ihre Entwürfe ohne Bilder entwerfen oder verwenden Sie mehrere div's.

Das Beispiel sehen Sie im Bild wurde mit dem folgenden Code gemacht:

Archiv style.css

#ejemplo1 {
height: 65px;
width:160px;
background-color:#EEEEEE;
-moz-border-radius-bottomright: 50px 25px;
border-bottom-right-radius: 50px 25px;
}

#ejemplo2 {
height: 65px;
width:160px;
background-color:#FF0000;
-moz-border-radius-bottomright: 25px 50px;
border-bottom-right-radius: 25px 50px;
}

#ejemplo3 {
height: 5em;
width: 12em;
background-color:#0000FF;
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
}

#ejemplo4 {
height: 65px;
width:160px;
background-color:#F2F2F2;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
}

Syntax:

border-*-*-radius: [ | <%> ] [ | <%> ]?