les cadres

Publié le par e-commerce

Les cadres HTML permettent aux auteurs de présenter des documents à travers des vues multiples. Ces vues peuvent être des fenêtres indépendantes ou des portions de fenêtre. Les vues multiples permettent aux concepteurs de maintenir une certaine partie de l'information visible, tandis que d'autres vues sont défilées ou carrément remplacées. Par exemple, l'on pourrait utiliser trois cadres : un premier pour une en-tête statique, une pour un menu de navigation, et un troisième pour la vue "principale", laquelle peut être défilées ou remplacée en cliquant sur un élément activable du cadre de "navigation".

Disposition des cadres

Un document HTML avec cadres a une structure légèrement différente qu'un document HTML sans cadres. Un document standard est composé d'une section HEAD et une section BODY. Un document avec cadres dispose quant à lui d'une section HEAD, d'une section FRAMESET, et d'une dernière section optionnelle BODY.

La section FRAMESET d'un document spécifie comment seront disposées les vues dans la fenêtre principale de l'agent utilisateur.

La section BODY qui suit la section FRAMESET permet d'y mentionner un contenu alternatif au cas où l'agent utilisateur ne supporterait pas les cadres ou serait configuré pour les ignorer. Une discussion plus approfondie sur la façon de définir une alternative de contenu sera présentée ci-après.

Les éléments qui seraient normalement placés dans une section BODY d'un document sans cadres ne peuvent apparaître avant la première déclaration de FRAMESET, auquel cas l'élément FRAMESET serait ignoré.

L'élément FRAMESET

L'élément FRAMESET construit le découpage de la fenêtre principale en différents rectangles indépendants.

Lignes et colonnes

La définition de l'attribut rows donne le nombre de coupes horizontales. La définition de l'attribut cols donne le nombre de coupes verticales. Les deux attributs peuvent être utilisés simultanément pour construire un découpage en grille.

Si l'attribut rows n'est pas défini, chaque colonne s'étend sur toute la hauteur de la page. Si l'attribut cols n'est pas défini, chaque cadre s'étend sur toute la largeur de la page. Si aucune des deux attributs n'apparaît, le cadre unique résultant prend les mêmes dimensions que la page.

Ces deux attributs prennent pour valeur une liste de longueurs séparées par des virgules. Une longueur peut être absolue (un nombre de pixels ou un pourcentage d'écran) ou une longueur relative, indiquée sous la forme "i*", où "i" est un entier. Lors de l'attribution d'espace aux rangs et aux colonnes, les agents utilisateurs attribuent d'abord les longueurs absolues, puis divisent l'espace qui reste entre toutes les définitions relatives. La valeur "*" est équivalente à "1*".

Les vues sont créées de gauche à droite (pour les coupes verticales) et de haut en bas (pour les coupes horizontales). Lorsque les deux attributs apparaissent, les vues sont créées de gauche à droite dans la première ligne, puis de gauche à droite dans la deuxième ligne, etc.

Le premier exemple divise l'écran horizontalement en deux (c-à-d., crée une moitié supérieure et une moitié inférieure).

<FRAMESET rows="50%, 50%">

...le reste de la définition...

</FRAMESET>

L'exemple suivant crée trois colonnes : la colonne centrale a une largeur fixe de 250 pixels (c'est utile, par exemple, pour y placer un eimage d'une taille connue à l'avance). La première recevra 25% de l'espace restant et la troisième 75% de ce même espace.

<FRAMESET cols="1*,250,3*">

...le reste de la définition...

</FRAMESET>

L'exemple qui suit crée une grille 2x3.

<FRAMESET rows="30%,70%" cols="33%,34%,33%">

...le reste de la définition...

</FRAMESET>

Dans l'exemple qui suit, nous supposerons que la fenêtre du navigateur a une hauteur actuelle de 1000 pixels. 30% de la hauteur totale (300 pixels) est attribué à la première vue. La deuxième vue à une hauteur de 400 pixels exactement. Il reste donc 300 pixels à répartir entre les deux cadres restants. La hauteur de la quatrième vue est spécifiée valoir "2*", et est de ce fait deux fois plus haute que la troisième vue (de hauteur "*" (1*)). Dans notre cas, la hauteur de la troisième vue sera donc calculée à 100 pixels tandis que la quatrième vaudra 200 pixels.

<FRAMESET rows="30%,400,*,2*">

...le reste de la définition...

</FRAMESET>

Si une définition de longueurs absolues est telle que leur somme diffère de 100% de l'espace réellement disponible, les agents utilisateurs ajusteront toutes les longueurs en conséquence. En cas de sousdéfinition, l'espace restant sera divisé proportionellement, chaque portion étant respectivement rajoutée à chacune des vues. En cas de surdéfinition, chaque vue sera amputée proportionnellement.

Publié dans l'informatique

Commenter cet article