Cadre HTML

En utilisant les cadres, vous pouvez afficher plus d'une page dans la même fenêtre du navigateur.

Exemple

Cadre vertical
Exemple : Comment créer un cadre vertical en utilisant trois documents différents
Cadre horizontal
Exemple : Comment créer un cadre horizontal en utilisant trois documents différents

(Vous trouverez plus d'exemples en bas de cette page)

Cadre

En utilisant les cadres, vous pouvez afficher plus d'une page dans la même fenêtre du navigateur. Chaque document HTML est appelé un cadre et chaque cadre est indépendant des autres cadres.

Mauvaises pratiques d'utilisation des cadres :

  • Les développeurs doivent suivre simultanément plus de documents HTML
  • Il est difficile d'imprimer une page entière
L'étiquette de structure de cadre (<frameset>)
  • L'étiquette de structure de cadre (<frameset>) définit comment diviser la fenêtre en cadres
  • Chaque frameset définit une série de lignesouColonnes
  • Les valeurs de rows/columns déterminent la surface occupée par chaque ligne ou colonne sur l'écran

Note de l'éditeur :L'étiquette frameset est également traduite dans certains articles et livres par cadre.

Étiquette de cadre (Frame)

L'étiquette Frame définit le document HTML placé dans chaque cadre.

Dans l'exemple suivant, nous avons configuré un cadre à deux colonnes. La première colonne est configurée pour occuper 25% de la fenêtre du navigateur. La deuxième colonne est configurée pour occuper 75% de la fenêtre du navigateur. Le document HTML "frame_a.htm" est placé dans la première colonne, tandis que le document HTML "frame_b.htm" est placé dans la deuxième colonne :

<frameset cols="25%,75%">
　　 <frame src="frame_a.htm">
　　 <frame src="frame_b.htm">
</frameset>

Principales précautions - conseils utiles :

Si un cadre a des bordures visibles, l'utilisateur peut glisser les bordures pour modifier sa taille. Pour éviter cela, vous pouvez ajouter dans l'étiquette <frame> : noresize="noresize".

Ajoutez le tag <noframes> pour les navigateurs qui ne supportent pas les cadres.

Remarque importante :Il n'est pas possible d'utiliser les balises <body></body> et <frameset></frameset> en même temps ! Cependant, si vous ajoutez des balises <noframes> contenant un texte, ce texte doit être imbriqué à l'intérieur des balises <body></body> (vous pouvez voir comment cela est réalisé dans le premier exemple ci-dessous).

Plus d'exemples

Comment utiliser le tag <noframes>.
Cet exemple montre : comment utiliser le tag <noframes>.
Structure de cadre mixte
Cet exemple montre comment créer une structure de cadre contenant trois documents, tout en les mélangeant en lignes et en colonnes.
Structure de cadre avec l'attribut noresize="noresize"
Cet exemple montre la propriété noresize. Dans cet exemple, le cadre n'est pas redimensionnable. En glissant la souris sur les bordures entre les cadres, vous constaterez que les bordures ne peuvent pas être déplacées.
Cadre de navigation
Cet exemple montre comment créer un cadre de navigation. Le cadre de navigation contient une liste de liens prenant le second cadre comme cible. Le fichier "contents.htm" contient trois liens.
Cadre en ligne
Cet exemple montre comment créer un cadre en ligne (cadre dans une page HTML).
Sauter à une section spécifiée dans un cadre
Cet exemple montre deux cadres. L'un des cadres contient un lien pointant vers une section spécifiée dans un autre fichier. Le fichier "link.htm" spécifie une section en utilisant <a name="C10">.
Utilisation de la navigation par cadre pour sauter à une section spécifiée
cet exemple, deux cadres sont démontrés. Le cadre de navigation de gauche contient une liste de liens, ces liens prennent le second cadre comme cible. Le second cadre affiche le document lié. Les liens dans le cadre de navigation pointent vers les sections spécifiées dans le fichier de cible.