Frames

Les frames permettent de définir des cadres dans une fenêtre du navigateur, chaque cadre pouvant accueillir des documents HTML différents. Vu que les outils d'édition de pages web les plus courants actuellement ne sont pas tous capables de générer des frames on profite de l'occasion pour s'initier à l'écriture de documents en langage HTML.

Exemple: Etapes à parcourir pour obtenir une fenêtre avec deux cadres

1. Créer les documents HTML à mettre dans les cadres


Code HTML du fichier sommaire.html

Code HTML du fichier rapport.html

<HTML>
<HEAD>
</HEAD>
<BODY>
Sommaire
<OL>
<LI> Chapitre
<LI>Chapitre
</OL>
<UL>
<LI>3. Chapitre
<LI>4. Chapitre
</UL>
</BODY>
<HTML>

<HTML>
<HEAD>
</HEAD>
<BODY>
<H1> Rapport</H1>
<H2> Chapitre 1</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
<H2> Chapitre 2</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
<H2> Chapitre 3</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
<H2> Chapitre 4</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
</BODY>
<HTML>



2. Créer un fichier texte qui défini les cadres

<FRAMESET COLS="40%,60%">
<NOFRAME> Cette page de démonstration ne peut être lue qu'avec un logiciel compatible Netscape 2.03. ou supérieur
</NOFRAME>
<FRAME NAME=ouest SRC="sommaire.html">
<FRAME NAME=est SRC="rapport.html">
</FRAMESET>

voici le résultat

3. Insérer des liens hypertexte entre les documents des cadres de manière à pouvoir contrôler l'affichage du texte


Code HTML du fichier sommaire_.html

Code HTML du fichier rapport_.html

<HTML>
<HEAD>
</HEAD>
<BODY>
<P>Sommaire </P>
<OL>
<LI><A HREF="rapport_.html#chap1" TARGET="est">Chapitre</A>
<LI><A HREF="rapport_.html#chap2" TARGET="est">Chapitre </A>
</OL>
<UL>
<LI><A HREF="rapport_.html#chap3" TARGET="est">3.Chapitre </A>
<LI><A HREF="rapport_.html#chap4" TARGET="est">4. Chapitre </A>
</UL>
</BODY>
</HTML>

<HTML>
<HEAD>
</HEAD>
<BODY>
<H1> Rapport</H1>
<a NAME="chap1"></a><H2>Chapitre 1</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
<a NAME="chap2"></a><H2></a>Chapitre 2</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
<a NAME="chap3"></a><H2>Chapitre 3</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
<a NAME="chap4"></a><H2> Chapitre 4</H2>
<p> texte du chapitre ...texte du chapitre ...texte du chapitre ...
</BODY>
<HTML>


voici le résultat