L'elemento iframe è la soluzione moderna e non deprecata all'utilizzo dei frame. Il nome deriva da inline frame (frame in linea) e si riferisce al fatto che, per mezzo di questo elemento, è possibile creare un frame all'interno di una pagina html, un po' come se ci si aprisse una specie di finestra su un'altra pagina. Un semplice esempio dovrebbe chiarire il concetto. Si consideri la pagina seguente (chiamiamola pagina2.html):
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Pagina secondaria</title> </head> <body> <p style = "background-color: pink">Questo è il testo contenuto nella pagina secondaria </p> </body> </html>
Si tratta di una semplicissima pagina html che produce nel browser la seguente visualizzazione:
Ora consideriamo quest'altra pagina (chiamata pagina1.html) che fa riferimento alla pagina precedente:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Pagina con un frame inline</title> </head> <body>
<iframe src="pagina2.html"></iframe> <p style = "background-color: yellow">Questo è il contenuto di pagina1.html </p> </body> </html>
Si noti la dichiarazione DOCTYPE Transitional necessaria per poter usare i frame inline. Visualizzando pagina1.html nel browser si ottiene il seguente risultato:
Si osservi che, prima del paragrafo in giallo, è stato visualizzato un riquadro (il frame inlinea) che mostra il contenuto di pagina2.html.
Si noti che iframe è un elemento contenitore, cioè dotato di un tag di apertura e di uno di chiusura. Di solito, come nell'esempio precedente, il contenuto dell'elemento viene lasciato vuoto. Tuttavia è possibile inserire all'interno dell'elemento un testo da visualizzare per quei browser che non dovessero supportare gli iframe. Attualmente però gli iframe sono visualizzati correttamente da tutti i browser moderni, perciò tale contenuto è abbastanza inutile.
L'elemento iframe ha diversi attributi. I principali sono i seguenti:
- src - specifica il file html che deve essere
visualizzato nell'iframe;
- name - assegna un nome all'iframe;
- width - imposta la larghezza dell'iframe;
- height - imposta l'altezza dell'iframe;
- marginwidth - imposta i margini orizzontali dell'iframe;
- marginheight - imposta i margini verticali dell'iframe;
- scrolling - imposta lo stato della barra di scorrimento;
può assumere i valori "yes", "no" e "auto" che,
rispettivamente, visualizzano, non visualizzano,
visualizzano solo se necessario, le barre di scorrimento.
- frameborder - serve per mostrare (1) o nascondere (0) il bordo dell'iframe.
Sito realizzato in base al template offerto da
http://www.graphixmania.it
