Iframe HTML
Un iframe HTML viene utilizzato per visualizzare una pagina Web all'interno di una pagina Web.
Sintassi iframe HTML
Il <iframe>tag HTML specifica un frame inline.
Un frame inline viene utilizzato per incorporare un altro documento all'interno del documento HTML corrente.
Sintassi
<iframe src="url" title="description"></iframe>
Suggerimento: è buona norma includere sempre un
titleattributo per <iframe>. Viene utilizzato dagli screen reader per leggere il contenuto dell'iframe.
Iframe - Imposta Altezza e Larghezza
Usa gli attributi heighte widthper specificare la dimensione dell'iframe.
L'altezza e la larghezza sono specificate in pixel per impostazione predefinita:
Esempio
<iframe src="demo_iframe.htm" height="200" width="300"
title="Iframe Example"></iframe>
Oppure puoi aggiungere l' styleattributo e utilizzare il CSS heighte le width
proprietà:
Esempio
<iframe src="demo_iframe.htm" style="height:200px;width:300px;"
title="Iframe Example"></iframe>
Iframe - Rimuovi il bordo
Per impostazione predefinita, un iframe ha un bordo attorno.
Per rimuovere il bordo, aggiungi l' styleattributo e usa la proprietà CSS
border:
Esempio
<iframe src="demo_iframe.htm" style="border:none;"
title="Iframe Example"></iframe>
Con CSS, puoi anche modificare la dimensione, lo stile e il colore del bordo dell'iframe:
Esempio
<iframe src="demo_iframe.htm" style="border:2px solid red;"
title="Iframe Example"></iframe>
Iframe - Destinazione per un collegamento
Un iframe può essere utilizzato come frame di destinazione per un collegamento.
L' targetattributo del collegamento deve fare riferimento nameall'attributo dell'iframe:
Esempio
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe
Example"></iframe>
<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>
Riassunto capitolo
- Il
<iframe>tag HTML specifica un frame inline - L'
srcattributo definisce l'URL della pagina da incorporare - Includi sempre un
titleattributo (per lettori di schermo) - Gli attributi
heightewidthspecificano la dimensione dell'iframe - Utilizzare
border:none;per rimuovere il bordo attorno all'iframe
Esercizi HTML
Tag iframe HTML
| Tag | Description |
|---|---|
| <iframe> | Defines an inline frame |
Per un elenco completo di tutti i tag HTML disponibili, visita il nostro Riferimento ai tag HTML .