Fernanda Civit

Bordes Redondos con CSS

/ / 03 augustus 2010 / / Programacion

W3C ofrece algunas opciones Nuevas en cuanto een CSS3, de las cuales una es los Bordes redondeados. Tanto nl Mozilla como en Safari 3 estas funciones ya se encuentran en practica. La misma permite Crear Esquinas redondas sobre temas de Caja. Este es un ejemplo:

Usuarios de Mozilla y Safari deberian ver esta caja con Bordes redondos

El Código html de Arriba es el siguiente:
div style = "background-color: # ccc;-moz-border-radius: 5px;-webkit-border-radius: 5px; border: 1px solid # 000; padding: 10px;"

Estas diferentes Esquinas tambien pueden ser manejadas cada una por su cuenta. Mozilla tiene otros nombres para la funcion. Las cuales zoon:
-Moz-border-radius-topleft /-webkit-border-top-left-radius
-Moz-border-radius-topright /-webkit-border-top-rechts-radius
-Moz-border-radius-bottomleft /-webkit-border-bottom-left-radius
-Moz-border-radius-bottomRight /-webkit-border-bottom-rechts-radius

Si queremos que todas las Esquinas sean redondas no es Necesario que escribamos todo ese Código en nuestro CSS, solo basta con poner:
-Moz-box-shadow: 0 0 7px;
-Webkit-box-shadow: 0 0 7px;