Les iframes - XwZ

Bon dans ce tutorial on va voir les cadres par iframe c'est à dire que la page n'est pas divisé comme avec les frames (on verra plus tard). Les iframes permettes de faire changer le contenue d'une partie du site sans avoir à recharger la page.
La balise à utiliser est <iframe />
la syntaxe est simple :

<iframe />

Les attribut html à utiliser son src, name et class.
name :
Le nom du cadre est très important, il sert à l'identifier pour les liens.

src :
Dans cet attribut vous mettez l'adresse de la page qui doit être présente dans le cadre à l'ouverture de la page le contenant (éviter de mettre l'adresse de la page contenant le cadre car le navigateur bouclerais et planterait).

Petit exemple de code :

<iframe src="http://www.google.fr" name="google" />

Ici, le cadre s'appelle google et la page qui ce situe dedans est le site google.fr.
Afin de redimensionner le cadre à votre guise, utiliser les éléments height et width du CSS, vous devez bien les connaitres maintenant et aussi savoir comment on les utilises (si ce n'est pas le cas relisez les premiers tutoriaux ou allez faire un tour dans le lexique CSS).
Maintenant voyons concrètement à quoi sert l'attribut name. L'attribut name sert à modifier le contenue du cadre via les liens hypertextes avec un attribut que nous avons pas encore vu, c'est l'attribut target (en anglais ça veut dire cible).
Voyons comment l'utiliser :

<a href="http://www.htmlearn.net" target="google">Le site htmlearn.net</a>

Voila, ici quand le visiteur cliquera sur le lien ça changera le site du cadre, ce ne sera plus google.fr mais mon site, htmlearn.net.

ATTENTION :
- Si vous ne mettez pas de target dans la balise <a >, le lien ne s'ouvrira pas dans le cadre mais dans la fenêtre, comme s'il n'y avait pas de cadre iframe.
- Ne jamais utiliser _BLANK comme nom de cadre, ceci est un mot clés html, il sert à ouvrir le lien dans un nouvelle fenêtre.

Les iframes - XwZ

Les commentaires :