Rounded corners

Añade redondez a las esquinas

La redondez de las esquinas se puede especificar:

Cuatro valores: donde el primer valor se aplica a la parte superior izquierda, el segundo valor se aplica a la parte superior derecha, el tercer valor se aplica a la parte inferior derecha, y el cuarto valor se aplica a esquina inferior izquierda

Tres valores: donde el primer valor se aplica a la parte superior izquierda, el segundo valor se aplica a la parte superior derecha e inferior izquierda-y tercer valor se aplica a la parte inferior derecha

Dos valores: donde el primer valor se aplica a la esquina superior izquierda e inferior derecha, y el segundo valor se aplica a la parte superior derecha y la esquina inferior izquierda

Un valor: donde las cuatro esquinas son redondeadas igualmente

Ejemplo

Con las 4 esquinas

Con las 3 esquinas

Con las 2 esquinas

Ver código del ejemplo

Podemos cambiar la forma de la curva, cambiando la proporción

Borde eliptico

Borde eliptico

Redondo

Ver Código



bordes eliipticos
{ border-radius: 10px/30px; /* horizontal radius / vertical radius */ }
bordes elipticos
 { border-radius: 30px/10px; /* horizontal radius / vertical radius */