Come aggiungere immagini a un sito Web HTML

L'aggiunta di immagini alle pagine del tuo sito web può spesso renderle più piacevoli alla vista e trasmettere informazioni migliori rispetto all'utilizzo del solo testo. Questo processo si ottiene utilizzando il codice HTML e un file immagine. Il file può provenire da una pagina Web diversa o memorizzato su un server web.

Usando il etichetta

Nel codice HTML per una pagina web, puoi aggiungere un'immagine usando il etichetta. Nel tag, è necessario specificare quattro attributi:

  • Src : l'attributo source indica la posizione dell'immagine. Puoi utilizzare un percorso relativo se l'immagine si trova sullo stesso server del tuo sito, ma le immagini di un altro sito richiedono percorsi assoluti.
  • Alt - L'attributo di testo alternativo è una descrizione scritta dell'immagine.
  • Larghezza : la larghezza dell'immagine.
  • Altezza : l'altezza dell'immagine.

Un attributo opzionale è Border, che consente di specificare un bordo attorno all'immagine. L'attributo border è definito in pixel. Ad esempio, usando border = 1 in tag significa che il bordo attorno all'immagine sarà largo 1 pixel.

Nota: l'attributo Border è stato deprecato in HTML5 e non è supportato.

Esempi

I seguenti esempi mostrano l'effettivo codice HTML utilizzato per aggiungere l'immagine nella parte superiore di questa pagina. Possono essere inseriti ovunque nel corpo della pagina. Il primo ha un URL più breve perché l'immagine è memorizzata sul nostro server; il secondo è come collegheresti alla nostra immagine.

Esempio uno

Esempio due

Quali formati di immagine posso usare su una pagina web?

I formati di immagine più comuni da utilizzare per immagini, foto, loghi e altre immagini sono JPEG, GIF e PNG. Altri formati di immagine che non sono ampiamente supportati come BMP potrebbero non funzionare in tutti i browser.

Ho bisogno di virgolette sugli attributi nel tag img?

Sì. Sebbene i browser di oggi possano in genere correggere eventuali errori con virgolette mancanti attorno a un valore di attributo, è necessario avere sempre virgolette attorno a un valore di attributo per evitare errori.