Como hacer bordes redondeados en los elementos html, para todos los navegadores?

Escrito el 12 de mayo del 2011 por Inturias en la categoría → Tutorial

Con Border-radius.htc podemos crear bordes redondeados para todos los elementos html (en especial para los DIV’s) es una simple librería que genera el borde automáticamente en cualquier navegador como: FF, Chrome, Safari, IE6, IE7 e IE8, aun que ya no lo necesitamos para las ultimas versiones de Firefox, Chrome o Safari y tampoco con IE9.

Su uso es sencillo:

.bordes {
   -moz-border-radius:10px;
   -webkit-border-radius:10px;
   behavior:url(border-radius.htc);
}

Como ven usamos la propiedad de border-radius del CSS3 para generar el borde y automáticamente la librería reconoce si es IE6 o IE7 para ejecutarla.

Entonces solo nos queda agregar la clase “bordes” (pueden cambiarlo por cualquiera).

<div class="curved">Curvd div</div>

Y el resultado sería este:

Documentación y Descarga | Border-radius.htc

2 Comentarioss
Tags , ,

RSS 2.0

  1. Por Gaston
    El 31 de mayo de 2011 a las 16:27

    BUEN APORTE, MUCHAS GRACIAS, DUDE.

  2. Por QC
    El 14 de agosto de 2011 a las 12:10

    Si le pones de nombre a la clase css `bordes`, y al div, `curved`, no va a funcionar.
    Y por otra parte, en css3, es border-radius el parámetro, el cual vale para todos los navegadores que lo soporten (todos, menos IE<9)

2 Comentario en
“Como hacer bordes redondeados en los elementos html, para todos los navegadores?”





Subir ↑↑