arrow Home » Tutoriaux » Les iframes

Les iframes

(X)HTML / CSS - 31 aoû 2004 - j0n3s
ou comment insérer une page dans une autre


Les iframes sont utilisées pour afficher le contenu d'une page web, au sein même d'une autre. Les iframes se comportent comme les frames normales, à part que vous pouvez en positionner une en plein milieu d'une page.

1) Comprendre

Dans une iframe, vous pouvez définir plein de choses comme : sa taille, son alignement, bordure ou non, la méthode de scrolling, le style ...
Les liens présent dans l'iframe ouvrent une page dans l'iframe. Vous me direz que c'est bête mais ne vous inquiétez pas il y a un moyen d'ouvrir une page normale depuis un lien d'une iframe. Vous pouvez aussi ouvrir une page dans une iframe à partir d'un lien externe à l'iframe.

2) Créer l'iframe et la placer

D'abord prenez la page qui va contenir l'iframe et placer le code ci dessous :


Code
<iframe align="right" width="500" height="500" frameborder="1" scrolling="auto" src="page1.htm" name="iframe"></iframe>


Vous pouvez bien sur remplacer les attributs par ceux qui vous conviennent :


Code
align="right"

» l'alignement : vous pouvez mettre right, left, center (aligné à droite, à gauche, centré)


Code
width="500"

» la largeur


Code
height="500"

» la hauteur


Code
frameborder="0"

» 0 : pas de bordure, 1 : bordure


Code
scrolling="auto"

» le scrolling : auto : mettra un scroll si nécessaire, no : non, yes : oui


Code
src="page1.htm"

» la page qui sera présente dans l'iframe


Code
name="iframe"

» le nom de votre iframe

Ensuite créer votre page1.htm (ou autre), la page par défaut dans l'iframe ...

3) Faire des liens


Code
<a href="page2.htm" target="iframe">Page 2</a>

» lien interne qui ouvre une page dans l'iframe (iframe = nom de votre iframe)


Code
<a href="page2.htm">Page 2</a>

» lien interne qui ouvre une page dans l'iframe


Code
<a href="page2.htm" target="_parent">Page 2</a>

» lien externe qui ouvre une page par dessus l'iframe


Code
<a href="page2.htm" target="_blank">Page 2</a>

» lien interne qui ouvre une page dans une nouvelle fenetre

Voilà c'est fini ! C'est simple de faire une iframe, non ? En tous cas j'espère que ce tuto vous a aidé et a été clair.
Précédent : Console de récupérationSuivant : EasyPHP


6.0 /10 (213 votes)


Commentaires

Aucun commentaire !

Postez un commentaire !
Vous devez être inscrit(e) et connecté(e) pour ajouter un article !