Manuale di riferimento HTML

Completo elenco dei tag HTML

HTML: <input> etichetta HTML: <iframe> etichetta

HTML: <img> etichetta

Il tag <img> HTML definisce un'immagine in un documento HTML. Questo tag è anche noto come elemento <img>.

Esempio online

Come inserire un'immagine:

Esempio

<!DOCTYPE　html>
<html>
<head>　
<meta charset="utf-8">　
<title>Base Tutorial Network (oldtoolbag.com)</title>　
</head>
<body>
<img src="pig.gif" alt="pig face" width="32" height="32">
</body>
</html>

Prova a vedere ‹/›

Compatibilità dei browser

IEFirefoxOperaChromeSafari

Tutti i browser mainstream supportano il tag <img>.

Differenze tra l'attributo alt e title dell'immagine:

L'attributo alt dell'immagine è il testo che appare come suggerimento quando l'immagine non si visualizza correttamente.
L'attributo title dell'immagine è il testo che appare come suggerimento quando il mouse si muove sopra l'elemento.

Definizione e istruzioni per l'uso del tag

Il tag <img> definisce un'immagine nella pagina HTML.

Il tag <img> ha due proprietà obbligatorie: src e alt.

Il tag <img> può supportare (a seconda del browser) i seguenti formati di immagine: jpeg, gif, png, apng, svg, bmp, bmp ico, png ico.

Nota:Technicamente, l'immagine non viene inserita nella pagina HTML, ma collegata a essa. Il tag <img> ha la funzione di creare un placeholder per l'immagine richiamata.

Suggerimento:Aggiungi un collegamento a un altro documento alla immagine tramite l'incorporamento del tag <img> all'interno del tag <a>.

Differenze tra HTML 4.01 e HTML5

HTML5 non supporta le seguenti proprietà: align, border, hspace, longdesc, vspace.

In HTML 4.01, le seguenti proprietà sono obsolette: align, border, hspace, vspace.

Differenze tra HTML e XHTML

In HTML, il tag <img> non ha un tag di chiusura.
In XHTML, è necessario chiudere correttamente il tag <img>.

Proprietà

New: Proprietà aggiunta in HTML5.

Proprietà	Valore	Descrizione
align	top 　bottom 　middle 　left 　right	HTML5 non supporta. HTML 4.01 è obsoleto. 　　Regola come posizionare l'immagine in base al testo circostante.
alt	text	Regola il testo alternativo dell'immagine.
border	pixels	HTML5 non supporta. HTML 4.01 è obsoleto. 　　Regola il bordo intorno all'immagine.
crossoriginHTML5	anonymous use-credentials	Imposta l'attributo dicrossdomain dell'immagine.
height	pixels	Regola l'altezza dell'immagine.
hspace	pixels	HTML5 non supporta. HTML 4.01 è obsoleto. 　　Definire lo spazio vuoto sinistro e destro dell'immagine.
ismap	ismap	Definire l'immagine come mappa immagine server-side.
longdesc	URL	HTML5 non supporta. HTML 4.01 è obsoleto. 　　Puntare all'URL che contiene un documento di descrizione lunga dell'immagine.
src	URL	Definire l'URL di visualizzazione dell'immagine.
usemap	#mapname	Definire l'immagine come mappa immagine client-side.
vspace	pixels	HTML5 non supporta. HTML 4.01 è obsoleto. 　　Definire lo spazio vuoto superiore e inferiore dell'immagine.
width	pixels	Definire la larghezza dell'immagine.

Attributi globali

Supporto <img> etichetta Attributi globali HTML.

Attributi eventi

Supporto <img> etichetta Attributi eventi HTML.

Prova l'esempio online

Allineamento immagine
Questo esempio dimostra come allineare un'immagine nel testo.

Immagini fluttuanti
Questo esempio dimostra come far fluttuare un'immagine sulla sinistra o destra del paragrafo.

Impostare collegamento immagine
Questo esempio dimostra come utilizzare un'immagine come collegamento.

Creare mappa immagine
Questo esempio mostra come creare una mappa immagine con aree cliccabili. Ogni area è un collegamento ipertestuale.