Las esquinas redondeadas de CSS3 se usan para agregar esquinas de colores especiales al cuerpo o al texto mediante la propiedad border-radius. Una sintaxis simple de esquinas redondeadas es la siguiente:
La siguiente tabla muestra los valores posibles para las esquinas redondeadas de la siguiente manera:
| No. | Valor y descripción |
|---|---|
| 1 | border-radius Use este elemento para establecer la propiedad de radio de cuatro fronteras |
| 2 | border-top-left-radius Use este elemento para establecer el borde de la esquina superior izquierda |
| 3 | border-top-right-radius Use este elemento para establecer el borde de la esquina superior derecha |
| 4 | border-bottom-right-radius Use este elemento para establecer el borde de la esquina inferior derecha |
| 5 | border-bottom-left-radius Use este elemento para establecer el borde de la esquina inferior izquierda |
Ejemplo
Esta propiedad puede tener tres valores. El siguiente ejemplo usa ambos valores:
Manipulando cada esquina
Podemos especificar la propiedad de cada esquina como se muestra a continuación: