Balises pour les Frames.

Download Report

Transcript Balises pour les Frames. 

Les cadres ou frames
Définition
 Les cadres, appelés également
frames, permet de diviser les pages
web en plusieurs fenêtre, contenant
chacune une page différente.
Structure de base
 <html>
 <head><title> la structure de base
</title></head>
 <frameset>

définition de l’ensemble des cadres
 <noframes>
 <body>

le navigateur ne gère pas les cadres
 </body> </noframes>
 </frameset>
 </html>
Définition des cadres





Subdivision en lignes
Subdivision en colonnes
Barres de défilement
Nom de cadre
Liens vers les cadres
Subdivision en lignes
 Par l’intermédiaire de la définition des
lignes, on détermine la division
horizontale de l’écran.
 Syntaxe :
<frameset rows=‘’nombres’’>
 Ou ‘’nombre’’ : définie le nombre de
lignes pour chacun des cadres.
Exemple1 (Définition par Nombres)









<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset rows="100,400">
<frame >
<frame >
</frameset>
<body>
 </body>
 </HTML>
Exécuter
Exemple 2 (Définition par %)









<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset rows=“20%,80%">
<frame >
<frame >
</frameset>
<body>
 </body>
 </HTML>
Exécuter
Exemple 3 (Définition par Wildcard)









<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset rows=“20%,*">
<frame >
<frame >
</frameset>
<body>
 </body>
 </HTML>
Retour
Exécuter
Subdivision en colonnes
 Par l’intermédiaire de la définition des
colonnes, on détermine la division
verticale de l’écran.
 Syntaxe <frameset cols=‘’nombres’’>
 Ou ‘’nombre’’ : définie le nombre de
colonnes pour chacun des cadres.
Exemple 4









<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset cols="100,400">
<frame >
<frame >
</frameset>
<body>
 </body>
 </HTML>
Exécuter
Exemple 5









<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset cols=“20%,80%">
<frame >
<frame >
</frameset>
<body>
 </body>
 </HTML>
Exécuter
Exemple 6









<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset cols=‘20%,*’>
<frame src='exercice1.html' >
<frame src='exercice5.html‘ >
</frameset>
<body>
 </body>
 </HTML>
Retour
Exécuter
Barres de défilement
 Le paramètre scrolling associé au
frame permet d’activer ou désactiver
la barre de défilement.
 Les valeurs de scrolling peuvent être:
 ‘no’ : barre désactive
 ‘yes’ : barre activé
 ‘auto’ : barre activé en cas de
nécessité
Exemple 7









<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset cols=‘20%,*’>
<frame src='exercice1.html' scrolling = ‘YES’>
<frame src='exercice5.html‘ scrolling = ‘NO’>
</frameset>
<body>
 </body>
 </HTML>
Retour
Exécuter
Nom de cadre
 Le paramètre name de la balise
frame permet d’associer un nom à
chaque cadre affin d’être référencé.
Exemple 8


<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset cols=‘20%,*’>
<frame name = ‘gauche’ src='exercice1.html' scrolling =
‘YES’>
<frame name = ‘droit’ src='exercice5.html‘ scrolling =
‘NO’>
</frameset>
<body>


</body>
</HTML>







Retour
Exécuter
Liens vers les cadres
 Donner un nom aux cadres d’une
page permet de les références est de
les liés à d’autres page.
Exemple 9












<HTML>
<HEAD>
<TITLE>Exercices </TITLE>
</HEAD>
<body>
<a href='exercice1.html' target
</a><BR>
<a href='exercice2.html' target
</a><BR>
<a href='exercice3.html' target
</a><BR>
<a href='exercice4.html' target
</a><BR>
<a href='exercice5.html' target
</a><BR>
</body>
</HTML>
= 'droit'> exercice N°1
= 'droit'> exercice N°2
= 'droit'> exercice N°3
= 'droit'> exercice N°4
= 'droit'> exercice N°5



<HTML>
<HEAD>
<TITLE> Frames </TITLE>
</HEAD>
<frameset cols="20%,80%">
<frame name = "gauche" src='exempleframe91.html'
scrolling = 'YES' >
<frame name = "droit" >
</frameset>
<body>


</body>
</HTML>






Exécuter
Balises pour les FRAMES
1. Balise FRAMESET
2. Balise FRAME
3. Options des hyperliens avec les frames
Balise FRAMESET
BALISES
ATTRIBUTS
<FRAMESET.>
…
</FRAMESET>
<FRAMESET
ATTRIBUTS>…
</FRAMESET>
FONCTIONS
Remplace le tag <BODY> dans les fichiers frames.
ROWS = "n%,n%,n%"
ROWS = "n,n,n"
ROWS = "n*,n*,n*"
Détermine la hauteur des fenêtres verticales en pourcentage.
Détermine la hauteur des fenêtres verticales en pixels.
Détermine la hauteur des fenêtres verticales relatif à la hauteur.
COLS = "n%,n%,n%"
COLS = "n,n,n"
COLS = "n*,n*,n*"
Détermine la largeur des fenêtres horizontales en pourcentage.
Détermine la largeur des fenêtres horizontales en pixels.
Détermine la largeur des fenêtres horizontales relatif à la
hauteur.
FRAMEBORDER = "?"
Indique, ou non , la présence de la bordure 3D. (yes ou no)
FRAMESPACING = n
Indique l'espace, en pixels, qu'il y a entre les différents cadres.
(IE)
BORDER = n
Indique, en pixels, la largeur de la bordure.
BORDERCOLER =
"#rrvvbb"
Indique la couleur de la bordure en hexadécimal.
La bordure perd son effet 3D lorsque cet attribut est utilisé
Balise FRAME
BALISES
ATTRIBUTS
<FRAME.>…
</FRAME>
<FRAME
OPTIONS>…
</FRAME>
FONCTIONS
Cadre ou frame qui contiendra une page HTML.
NAME =
"nom_cadre"
Donne un nom au cadre; il pourra être utilisé pour indiquer une cible.
SRC = "nom_fichier"
Fichier HTML normal dont le contenu sera affiché dans le cadre.
SCROLLING = "?"
Contrôle du défilement vertical dans le cadre. (yes, no ou auto).
MARGINWIDTH = "x"
La largeur des marges de gauche et de droite à l'intérieur du cadre.
MARGINHEIGHT =
"y"
La grandeur des marges du haut et du bas à l'intérieur du cadre.
NORESIZE
Empêche le visiteur de redimensionner le cadre.
FRAMEBORDER =
"?"
Indique si le cadre comporte ou non une bordure (1=oui ou 0=non).
FRAMESPACING = n
Indique l'espace, en pixels, qu'il y a entre les différents cadres.
Ces valeurs sont écrasées par celles définit dans FRAMESET.
BORDERCOLOR =
"#rrvvbb"
Spécifie la couleur de la bordure du cadre en hexadécimal.
La bordure perd son effet 3D lorsque cet attribut est utilisé
BORDER = n
Indique, en pixels, la taille de l'espace entre les cadres.
Options des hyperliens avec les
frames
BALISES
ATTRIBUTS
<A
HREF="Fichier.htm">
…</A>
<A
HREF="Fichier.htm"
OPTION>
…
</A>
FONCTIONS
Indique le fichier qui sera chargé dans un
cadre.
TARGET = "name"
TARGET = "_blank">
TARGET = "_self">
TARGET = "_parent">
TARGET = "_top">
Charger le fichier dans le cadre spécifié par
NAME. (Voir plus haut)
Oblige la page à s'ouvrir dans une nouvelle
fenêtre du navigateur.
La page s'ouvre obligatoirement dans le
cadre où se trouve le lien.
Cette valeur force l'ouverture du lien en
plein écran.
La page va s'ouvrir dans une fenêtre
séparée. Les cadres s'envollent.