En esta entrada voy a explicar cómo redondear las imágenes utilizando una de las nuevas funciones que trajo CSS3, el border-radius. Como ves, arriba de este párrafo se ve una demostración.
Para poner en funcionamiento el truco, primero hay que agregar los estilos a la plantilla:
Ir a Plantilla, Editar HTML y localizar la línea ]]></b:skin> (CTRL + F). Antes de esta línea pegar lo siguiente:
.borde-redondeado > img {
-webkit-border-radius:1.5em;
border-radius:1.5em;
-moz-border-radius:1.5em;
border:none !important;
}
Guardar los cambios.Ahora cuando quieras usar este efecto en alguna imagen tendrás que usar este código:
<span class="borde-redondeado"><img
src="URL de la imagen" />
</span>
Aclaraciones:- 1.5 em es la medida que tiene el redondeado. Mientras más grande sea más redonda se verá la imagen.
- En el segundo código habrá que editar lo azul por el link de la imagen.