LES FRAMES (Cadres)

Les frames ou cadres en français, sont utilisés pour la division d’une page web en plusieurs cadres. On utilise souvent les cadres dans un site en html qui a une ou plusieurs parties qui sont répétées dans tous les pages. Pour éviter d’écrire à chaque fois les parties répétées dans chaque page, on fait recours aux cadres.

Voyons cette image :

Voila bref ce que nous allons faire. Nous allons réaliser une page divisée en 3 parties comme vous le voyez sur l’image ci-dessus. Mais avant tout il nous faut des explications.

Il faut savoir que si on veut créer une page avec n cadre, on sera appelé à coder n+1 pages :
  • la page principale
  • les n cadres qui seront inclus dans la balise body de la page principale

Pour le respect des standards, les cadres ne sont pas codés comme des pages normales. On y mettra juste les contenus des cadres c'est-à-dire qu’ils seront dépourvus d’en-tête et de la balise body (mais bien sûre que ceci est facultatif).

Pour définir une collection des cadres, on utilise la balise frameset.
Syntaxe : <frameset>…</frameset>

La balise frameset prend certains attributs tels que :

  • Border=n (n étant un nombre entier) : on utilise l’attribut border pour déterminer la taille de la bordure.
  • bordercolor= couleur : on utilise bordercolor pour définir la couleur des bordures.
  • cols = liste : on utilise cols pour definir le nombre et les largeurs des cadres au sein d’une frameset.
  • rows =liste: on utilise rows pour definir le nombre et hauteurs des cadres au sein d’une frameset
  • frameborder [yes/no] ou frameborder [1/0] : Pour activer ou désactiver l’affichage des bordures.
    On utilise yes ou 1 pour l’activation et no ou 0 pour la désactivation de l’affichage des bordures.
  • Pour insérer un cadre dans une frameset, on utilise la balise frame. Le cas des cadres flottant, on utilise la balise iframe.

Pour insérer un cadre dans une frameset, on utilise la balise frame. Le cas des cadres flottant, on utilise la balise iframe.
Syntaxe : <frame src="adresse_de_la_page_à_afficher_sur_le_cadre">

Il faut aussi savoir que la balise frame peut avoir d’autres attributs facultatifs tels que :

  • bordercolor= couleur : on utilise bordercolor pour définir la couleur des bordures.
  • id= nom : on utilise id pour définir l’identificateur unique au sein du document.
  • marginheight= n : on utilise marginheight pour définir un espace de n pixels au-dessous et en-dessous du cadre.
  • marginwidth= n : on utilise marginwidth pour définir un espace de n pixels à gauche et à droite du document.
  • name= chaîne_de_caractère : on utilise name pour définir le nom du cadre.
  • noresize : sert à désactiver la possibilité de redimensionner manuellement le cadre.
  • scrolling= type : on utilise scrolling pour ajouter ou non les barres de défilement. Ici type prendra comme valeur yes pour l’affichage de la barre, no pour ne pas afficher la barre et auto pour afficher automatique la barre quand il le faut.

Exemple : Notre exemple sert à faire quelque chose de semblable avec l’image qu’on a illustré au début de ce cours.

Code source :
<

Une question? Cliquez ici pour la poser.

Retour sur le portail du HTML/CSS