Vous êtes sur la page 1sur 13

Balises de cadre

Les cadres permettent de partager lcran


du navigateur en diffrentes zones. document XHTML.

Chacun des cadres peut comprendre un

Changement de DTD
Pour utiliser les cadres, on ne peut utiliser
la DTD strict mais plutt la DTD framset
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1frameset.dtd">

Balises de cadre
2

Structure de cadre
La balise <frameset>
- Divise la fentre du navigateur en diffrents cadres

Balises de cadre

Attributs
- rows ou cols : pas simultanment, divise horizontalement ou
verticalement la fentre

Exemple
<frameset rows=150, 50%,*> ... </frameset>
3

Contenu de cadre
La balise <frame />
- Place un contenu dans un cadre

Balises de cadre

Attributs
- name : donne un nom unique au cadre - src : indique lURL du chier charger - frameborder : 1 par dfaut, active la bordure. 0 pour la dsactiver - noresize : empche de redimensionner le cadre
4

Contenu de cadre
- longdesc : lURL de la ressource contenant une description du
contenu du cadre

Balises de cadre

- scrolling : yes par dfaut, permet dafcher une barre de dlement


dans le cadre. La valeur no nafche pas de barre, et la valeur auto laisse le navigateur dcider sil y a besoin dune barre

- marginheight : taille (en pixels) de la marge haut - marginwidth : taille (en pixels) de la marge gauche

Contenu de cadre
Exemple
- <frameset rows="150,*" frameborder="1"> <frame src="head.html" /> <frameset cols="150,*,*" frameborder="1"> <frame src="menu1.html" /> <frame src="corps.html" /> <frame src="menu2.html" /> </frameset> </frameset>

Balises de cadre
6

Contenu de cadre
La balise <noframes>
- Fournit une prsentation alternative aux navigateurs ne prenant pas les cadres en charge

Balises de cadre

Exemple
<frameset rows=50,*> ... <noframes> <p> votre navigateur ne supporte pas les cadres <a href=noframe.html>version sans cadre</a> </p> </noframes> </noframes>
7

Contenu de cadre
Attributs
- aucun

Balises de cadre

Remarques
- On ne peut avoir quun seul lment <noframes> dans une page web - la section <noframes>doit tre place avant tout lment <frameset> imbriqu

Cadre ottant
La balise <iframe>
- Place un cadre ottant sur la page

Balises de cadre

Attributs
- align : dnit lalignement du cadre ottant par top, middle, bottom,
left ou right

- frameborder : 1 par dfaut, active la bordure, 0 la dsactive - width : la largeur en pixels ou relative du cadre - height : la hauteur en pixels ou relative du cadre
9

Cadre ottant
- name : donne un nom unique au cadre - src : lURL du chier charger dans le cadre - scrolling : idem balise <frame /> - longdesc : URL de la ressource contenant la description du contenu
du cadre

Balises de cadre

- marginheight : taille en pixels de la marge haute - marginwidth : taille en pixels de la marge gauche

10

Cadre ottant
Exemple
<iframe src=oat1.html width=50% height=50% align=right scrolling=no name=cadre1 frameborder=1> <p>Votre navigateur ne supporte pas les cadres ottants</p> </iframe>

Balises de cadre
11

Inconvnients

URL des cadres caches Impossible dajouter le contenu dun cadre en favoris Indexation dciente (le cadre est sorti de sa structure) Confusion de lutilisateur si plusieurs barres de dlement

Balises de cadre
12

Exercice
Crez une structure de cadre an de
10% de la hauteur

Balises de cadre

partager la fentre du navigateur comme suit :

100px de large

100px de large

7% de la hauteur 13