Imagen en blog con efecto redondeado.

Si deseamos que en nuestro blog las imágenes que insertamos en las entradas tengan el borde redondeado:



Entraremos en diseño de nuestro blog, edición HTML y antes de ]]></b:skin> introduciríamos el siguiente código:

.post-body img {
border-radius: 50%; /* Borde redondeado */
box-shadow: 0px 0px 15px #000; /* Sombra */
padding:0;
border:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
box-shadow: 0;
border-radius: 0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}
Al colocar cualquier imagen en nuestro blog, ésta aparecerá con los bordes redondeados.
Si no deseamos que se aplique para todas las imágenes lo que haremos es sustituir .post-body img por .redondeado y en el post donde decidamos que la imagen tenga los bordes redondeados insertaremos el siguiente código:

<img class="redondeado" height="240" src="url de nuestra imagen" width="320" />

Los parámetros en azul son el alto y el ancho que deseamos ponerle a nuestra imagen.

Podremos modificar el porcentaje de redondeado en border-radius: 50%;