|
Les
cadres (appelés frames en anglais) permettent de rendre
vos documents encore plus conviviaux, et servent à diviser l'écran
en plusieurs cadres, pour ce faire on utilise le couple de
tags <FRAMESET> ... </FRAMESET>. On
associe à chaque cadre une page html déclarée par la balise <FRAME>.
Pour
mettre en place une page comprenant plusieurs frames (cadres), vous
devez remplacer le tag <BODY> </BODY> par le tag
<FRAMESET> ... </FRAMESET> :
<HTML>
<HEAD>
les métas
<TITLE>Votre
titre</TITLE>
</HEAD>
<FRAMESET>
contenu de la page principale
</FRAMESET>
</HTML> |
La
balise FRAMESET:
La balise FRAMESET déclare
les frames et accepte deux attributs qui
déterminent la dimension de la frame:
ROWS
utilisé pour une division de la page en lignes.
COLS
utilisé pour
une division de la page en colonnes..
Pour
ces deux attributs, il existe trois catégories différentes:
-
Valeur numérique indiquant la taille de la frame en pixels
- Valeur en pourcentage, cas est très utile pour adapter la
proportion à la taille de la fenêtre choisie
- Valeur indiquée par une étoile ("*"). Dans ce cas, la
dimension correspondante est automatiquement celle qui reste
disponible dans la fenêtre du navigateur après détermination de
l'espace occupé par les
autres frames
Exemples:
<FRAMESET COLS="25%, 70%,15%">
pour trois cadres séparées verticalement
<FRAMESET ROWS="200, 600">
pour deux cadres séparées horizontalement
<FRAMESET ROWS="25%, *"> pour
deux cadres, le premier a 25% de largeur et le second aura le reste
dans la fenêtre du navigateur
FRAMESET
COLS="50%,50%" largeur de 2
frames verticales identiques
FRAMESET ROWS="33%,33%,34%"
hauteur de 3 frames horizontales identiques
MARGINWIDTH
espace entre la bordure gauche et droite et les éléments.
MARGINHEIGHT
espace entre la bordure haute et basse et les éléments.
SCROLLING="yes"
"no" "auto" barre
de défilement "toujours" "jamais" "si
besoin".
FRAMEBORDER="yes"
"no" Cet attribut
permet d'afficher ou non les bords des frames
BORDER : définit
la taille de la séparation entre deux fenêtres.
<noframes>votre_texte</noframes>.
Cette balise sert à définir le texte (votre_texte)
qui sera affiché par les browser ne supportant pas
l'utilisation de frames.
Exemple:
<HTML>
<HEAD>
<TITLE>titre_de_la_page</TITLE>
</HEAD>
<FRAMESET border=1
frameSpacing=2 borderColor=pink
rows="20%,80%" frameBorder=0>
<FRAME
name=haut scrolling="yes">
<FRAMESET
cols="25%,75%">
<FRAME
name="menu"
scrolling="yes">
<FRAME
name="principale"scrolling="auto">
</FRAMESET>
<noframes>
<body
leftmargin="2" topmargin="2">
</noframes>
</FRAMESET>
</HTML>
|
La
balise FRAME:
A l'intérieur de chaque marqueur
<FRAMESET> </FRAMESET>, vous utiliserez les
balises <FRAME>..< /FRAME> pour définir les propriétés
et le contenu de chaque cadre individuellement. Chaque
cadre possède un nom défini par l'attribut NAME et doit
être associé à une page web grâce à l'attribut SRC.
Exemple:
<FRAMESET COLS="30%,70%">
<FRAME NAME="cadre1" SRC="sommaire.htm">
<FRAME NAME="cadre2" SRC="article1.htm">
</FRAMESET>
Les attributs associées sont :
<
FRAME.>
src="URL": définit
l'URL du document HTML associé à la frame grâce
à une adresse absolue ou relative.
name="principale"
ce paramètre sert à nommer la frame.
marginwidth="valeur"spécifie
les marges entre le contenu du cadre et les bords gauche et droit de
la frame
marginheight="valeur"
précise les marges entre le contenu du cadre et les bords supérieur
et inférieur.
scrolling "yes/no/auto":
ce paramètre permet de contrôler le défilement des
barres de scrolling si le document dépasse le
cadre.
<noresize>: ce paramètre
interdit le de modifier les dimensions du cadre
< /FRAME>
Exemple:
<html>
<frameset rows="130,*" border=0 bordercolor=black>
<frame src=cadre1.htm NORESIZE
scrolling=no name="menu">
<frame src=cadre2.htm name="principale">
</frameset>
<Noframes>
C' est ma première page en langage HTML.
</noframes>
</html |
Remarques:
Les
Liens hypertextes vers des cadres:
Dans un document html classique
lorsqu'on clique sur un lien hypertexte le contenu de la page est
remplacé par un nouveau document html, alors qu'avec un document
formé de plusieurs cadres il est possible de modifier le contenu
d'un seul cadre sans toucher aux autres d'où un gain de temps de
transfert. La balise <a href=...> dispose d'un attribut nommé
TARGET qui prend pour valeur le nom donné à l'un des cadres présents
ou l'une des expressions suivantes :
- "_self" : l'URL cible s'affiche dans le cadre
contenant le lien
- "_parent" : l'URL cible s'affiche dans la structure
externe
- "_blank" : l'URL cible s'affiche dans une nouvelle fenêtre
du navigateur
- "_top" : l'URL cible s'affiche dans toute la fenêtre
du navigateur et les cadres disparaissent.
Exemple:
La page d'appel des frames s'écrit donc :
<HTML>
<HEAD>
</HEAD>
<FRAMESET COLS="25%,75%"
border=0 frameborder=no framespacing=0>
<FRAME SRC="menu1.htm" name="menu">
<FRAME SRC="page1.htm" name="principale">
</FRAMETSET>
</HTML> |
L'attribut target
de l'élément a
permet de diriger un document vers le cadre "principale":
<a href="venus1.html"
target=principale>Venus 1</a>
<a href="frames7c1.html"
target=cadre_droit class=droite>Lapin</a>
| 
