Come rendere un’ immagine Responsive

In questo articolo vedremo come rendere una qualsiasi immagine responsive.

Quest’immagine potremo poi aggiungerla comodamente a un post che stiamo creando oppure pubblicarla nel nostro spazio web sottoforma di pagina HTML da richiamare.

Il metodo sicuramente più rapido e diretto, tramite HTML, è quello di andare ad aggiungere dove desideriamo che compaia la nostra immagine il seguente codice:

<p>
  <a href="LINK DEL MIO SITO WEB" target="_blank">
    <img src="LINK IMMAGINE" style='width:100%;' border="0" alt="Null">
  </a>
</p>

Ovviamente modificheremo le scritte in blu:

“LINK DEL MIO SITO WEB” = inseriremo qui il link a cui vogliamo far andare gli utenti una volta cliccata l’immagine

“LINK IMMAGINE” = Inseriremo il link dell’immagine precedentemente caricata sul server oppure l’url di un immagine già presente sul web.

<img src="IMAGE LINK" border="0" class="responsive-image" alt="Null">

Poi, nel file CSS apportiamo la modifica:

 .responsive-image{
        height:auto;
        width:100%;
    }

style=”display:inline-block;width:645px;height:100px” data-ad-client=”ca-pub-0587361132440966″ data-ad-slot=”2759130652″>

Hai altre domande riguardo quanto appena trattato?

Aggiungi un commento qui sotto e vedrai che troverai risposta quanto prima!