Amriss Blog Tips

Today all developers care about viewing their sites on mobile devices.

For those who often already uses some platform or Framework that provides a responsive structure to the site and just need to make some adjustments. I'll leave here some tips on how to create a responsive image .

* To change directly in css :

. responsive {
max-width : 500px ;
width: 100 % ;
height: auto; }

. responsive img {
 max-width : 500px ; / * Maximum width of image * /
width: 100 % ;
max -height: 300px ; / * Maximum height of image * /
min-height : auto; / * Minimum height by default " auto" * / }


In html , images must be inserted in the div "responsive " as shown below :

<div class="responsive">
        <img src="img-responsiva.jpg" alt="img-responsiva" />
 < / div >


* To change directly in the html tag <img> :

<img src="imagemresponsiva.jpg" style="max-width: 500px; width: 100%; auto; height: " alt="img-responsiva" />

In the tag " max-width " , you change the default width of the image .