Cómo crear un nuevo estilo CSS para imágenes

Para crear un nuevo estilo para imágenes, los primeros pasos a seguir son los mismos que comento en mi entrada http://gooddesign.es/como-crear-un-estilo-nuevo-en-nuestra-plantilla-de-wordpress-para-texto-o-imagenes/.

Voy a crear un estilo nuevo para imágenes de forma que las imágenes definidas con este estilo estén dentro de un marco negro redondeado y con un tamaño predefinido.

Concretamente quiero conseguir este efecto para mis imágenes:

Estos son los atributos con los que necesito trabajar:

height: /*altura de la imagen*/
width: /*anchura de la imagen*/
border /*estilo del bordeado (color, tamaño, tipo)*/ 
border radius: /*redondeado*/ 

Como siempre pondré un nombre a mi estilo. En este caso el nombre será redondo:

/*----------- REDONDO. Imágenes redondas con tamaño predefinido----------- */
.redondo {
 height: 400px;
 width: 400px;
 border: 2px solid black;
 border-radius: 800px;
 }

Llamo al estilo desde el editor de texto de mi entrada o página de WordPress :


< img class="redondo" src="http:miimagen" >

 

Voilá. ¡Chupao!

¡ole ole! :-P

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *