To create a new style for images, the first steps to follow are the same as I explain in my post http://gooddesign.es/como-crear-un-estilo-nuevo-en-nuestra-plantilla-de-wordpress-para-texto-o-imagenes/.
I am going to create a new style for images so that the images defined with this style are inside a black rounded frame and have a predefined size.
Specifically, I want to achieve this effect for my images:
These are the attributes I need to work with:
height: /*image height*/
width: /*image width*/
border /*border style (color, size, type)*/
border-radius: /*rounded corners*/
As always, I will give a name to my style. In this case, the name will be redondo (rounded):
/*----------- REDONDO. Rounded images with predefined size ----------- */
.redondo {
height: 400px;
width: 400px;
border: 2px solid black;
border-radius: 800px;
}
I call the style from the text editor of my WordPress post or page:
<img class="redondo" src="http:myimage" >
Voilá. Piece of cake!