Les balises :: Les cadres <frame>

Créer des frames

Pour utiliser des frames je vous propose plusieurs exemple :

Exemple n°1 : 2 cadres verticaux

<frameset cols="20%, 80%">

<frame src="frame1.html" name="gauche" title="valeur correspondant au contenu du cadre">

<frame src="frame2.html" name="droite" title="valeur correspondant au contenu du cadre">

</frameset> 

1 2


Exemple n°2 : 2 cadres horizontaux

<frameset rows="20%, 80%">
<frame src="frame1.html" name="haut" title="valeur correspondant au contenu du cadre">
<frame src="frame2.html" name="bas" title="valeur correspondant au contenu du cadre">
</frameset>


1

2

 

 


Exemple n°3 : 2 cadres horizontaux et un vertical

<frameset cols="20%, 80%"> 
<frame src="frame1.html" name="gauche" title="valeur correspondant au contenu du cadre">
<frameset rows="50%, 50%">
<frame src="frame2.html" name="droit_haut" title="valeur correspondant au contenu du cadre">
<frame src="frame3.html" name="droit_bas" title="valeur correspondant au contenu du cadre">
</frameset>

1 2

3

 

 

Exemple n°4 : 2 cadres verticaux et un horizontal

<frameset rows="20%, 80%"> 
<frame src="frame1.html" name="haut" title="valeur correspondant au contenu du cadre">
<frameset col="50%, 50%">
<frame src="frame2.html" name="gauche" title="valeur correspondant au contenu du cadre">
<frame src="frame3.html" name="droite" title="valeur correspondant au contenu du cadre">
</frameset>

1

2

 

3

 


vers le haut

Les attributs de la balise <frameset>


Attribut Valeur Action
rows pourcentage (entre 1 et 100). Exemple : rows="20%,80%"
valeur en pixels
En fixant une seules des valeurs et en donnant à l'autre la valeur *, la valeur s'ajuste automatiquement. Exemple : rows="100,*"
Cadre horizontal
cols

pourcentage (entre 1 et 100). Exemple : cols="20%,80%"
valeur en pixels
En fixant une seules des valeurs et en donnant à l'autre la valeur *, la valeur s'ajuste automatiquement. Exemple : cols="100,*"

Exemple cols="100, 3*, *" la première colonne aura comme dimension 100 pixels (fixe), la deuxième colonne (variable) aura comme dimension 3/4 du reste de la fenetre, tandis que la dernière colonne aura comme dimension 1/4 du reste (* équivaut à 1*).

Cadre vertical
frameborder yes (valeur par défaut)
no
Indique si le cadre a une bordure ou non
border=n n est une valeur définissant la taille de la bordure en pixel Indique la taille de la bordure
bordercolor nom de la couleur
Valeur de la couleur en hexadécimal
Indique la couleur de la bordure
framespacing=n n est une valeur définissant l'espace entre les cadres Indique l'espace entre les cadres

vers le haut

Les attributs de la balise <frame>

La balise <frame> permet de définir un ou plusieurs cadres au sein de la balise <frameset>

Attribut Valeur Action
src url Définit l'emplacement de la page à afficher dans le cadre
name "nom" Définit un nom qui permettra d'afficher un autre document dans le cadre gâce à l'attribut target
marginwidth=n n est un entier spécifiant le nombre de pixels Taille des marges latérales
marginheight=n n est un entier spécifiant le nombre de pixels Taille des marges du haut et du bas
frameborder yes
no
Détermine si les cadres auront ou non une bordure
border=n n est un entier spécifiant le nombre de pixels Taille de l'espace entre les cadres (uniquement pour Netscape)
noresize (Aucune) Interdit à l'utilisateur de redimensionner les cadres (Ce n'est pas la valeur par défaut)
scrolling yes
no
auto
Permet ou non l'affichage d'une barre de défilement (auto laisse le navigateur décider de son utilité)
title title="valeur correspondant au contenu du cadre" attribut universel, qui permet de donner un titre à une frame, obligatoire pour l'accessibilité de votre site.

vers le haut

Comment éviter les erreurs avec les navigateurs non compatibles?

On utilisera les balises <noframes> et </noframes> permettant de spécifier un texte html à afficher en cas de navigateur ne permettant pas d'afficher les frames. Le texte entre les balises <noframes> et </noframes> doit donc contenir les balises <body> ... </body>.

Exemple :

<frameset cols="20%, 80%">
<frame src="frame1.htm" name="gauche" title="valeur correspondant au contenu du cadre">
<frame src="frame2.htm" name="droite" title="valeur correspondant au contenu du cadre">
</frameset> <noframes> <body> Cette page html nécessite un navigateur supportant les frames, veuillez nous en excuser. </body> </noframes>

vers le haut

Désigner un cadre avec un lien hypertexte

Pour faire afficher des liens dans un des cadres, il suffit d'utiliser l'attribut target dans la balise <a href ..> pour spécifier le nom du cadre qui a été spécifié dans la balise <frame> par l'attribut name.
Par exemple:

<a href="page.htm" target="gauche">


Valeur Action
_self Affiche la cible dans le même cadre que le lien
_parent Affiche la cible dans le cadre de niveau supérieur
_blank Affiche la cible dans une nouvelle fenêtre
_top Affiche la cible dans la fenêtre entière du navigateur

vers le haut