SELFHTML/Aides à la navigation HTML/XHML Cadres |
Cadres incorporés |
|
Définir des cadres incorporés |
|
Les cadres incorporés sont interprétés par l' Explorer Internet MS à partir de la version 3.x, par contre toujours pas par Netscape jusqu'à sa version 4.x comprise. Depuis HTML 4.0 ils font partie du standard HTML . Les cadres incorporés sont un moyen original de configuration pour la préparation de l'information, qui fonctionne autrement que les cadres "normaux". Les cadres incorporés ne créent pas de division de l'écran spécifique, mais sont au contraire semblables à des graphiques ou des passages vidéo à l'intérieur d'un fichier HTML, dans lesquels des sources étrangères, avant tout d'autres fichiers HTML peuvent être affichés.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>définir des cadres incorporés</title> </head> <body> <h1>Regarder par le carreau</h1> <p>Voyez donc SELFHTML par la fenêtre:</p> <iframe src="../../../index.htm" width="90%" height="400" name="SELFHTML_in_a_box"> <p>Votre navigateur ne peut malheureusement pas afficher de cadre incorporé: Vous pouvez appeler la page incorporée par ce lien: <a href="../../../index.htm">SELFHTML</a></p> </iframe> </body> </html> |
Pour les fichiers HTML avec des cadres incorporés prévaut l' ossature d'un fichier HTML. Les cadres incorporés peuvent alors se trouver dans le corps de texte d'un fichier HTML à un endroit désiré. Avec <iframe...>
vous introduisez un cadres incorporé (iframe = inline frame = cadre incorporé). Avec l'attribut src=
vous déterminez ce qui doit être
affiché dans le cadre incorporé. Ce peut être un autre fichier HTML ou une autre source de données locale ou extérieure. Pour l'affectation d'une valeur s'appliquent les mêmes règles que pour référencer en HTML.
De plus vous devez affectez un nom avec name=
au cadre
incorporé. Vous avez besoin de ce nom pour définir des liens à des cadres incorporés. Le nom ne doit pas être trop long et peut contenir ni espaces ni caractères spéciaux ni caractères accentués; les chiffres sont ensuite permis. N'utilisez tout au plus comme caractère spécial que le tiret de soulignement (_
), le trait d'union (-
), les deux points (:
) ou le point (.
). Par rapport à JavaScript le nom ne peut même contenir que des lettres des chiffres et le tiret de soulignement (_
). Les majuscules et minuscules sont aussi différenciées pour des langages comme JavaScript.
Il est vivement recommandé de fixer la largeur et la hauteur souhaitées pour le cadre incorporé. Mentionnez la largeur dans le repère d'ouverture <iframe>
avec l'attribut width=
, la hauteur avec height=
. Les mentions en pixels ou en pourcentage qui se réfèrent à la taille de l'espace disponible, sont permises.
Entre le repère d'ouverture <iframe>
et le repère de fermeture nécessaire </iframe>
vous pouvez noter du texte et d'autres éléments qui seront affichés par les navigateurs Web qui n'interprètent pas les cadres incorporés.
Quand vous notez le repère iframe
dans un fichier HTML, vous devez choisir pour ce fichier la variante HTML "Transitional". Les cadres incorporés ne correspondent donc pas non plus aux "dogmes".
Les autres possibilités d'afficher le contenu d'autres fichiers dans un fichier HTML sont d' incorporer des fichiers de données comme objet (également standard HTML), de définir des calques avec le contenu d'autres fichiers (spécifique à Netscape) ainsi que les Server Side Includes (conforme au standard HTML, seulement exécutables dans un environnement HTTP cependant).
Vous pouvez définir différentes autres propriétés pour aligner un cadre incorporé par rapport à son environnement.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Texte du titre</title> </head> <body> <h1>Image à faire défiler</h1> <iframe src="image.jpg" name="cadrimage" width="300" height="200" align="left" scrolling="yes" marginheight="0" marginwidth="0" frameborder="0"> <p>Votre navigateur ne peut malheureusement pas afficher de cadre incorporé: <img src="image.jpg" width="464" height="580" border="0" alt="image"></p> </iframe> <p>Cette photo a été prise sur la falaise de ... près de Mittenweld à environ 2400m d'altitude. Ce qui prouve tout ce qui peut nous arriver dans un état démocratique ...</p> </body> </html> |
L'exemple montre comment utiliser un cadre incorporé pour afficher un graphique plus grand que lui en affectant à ce cadre ses propres barres de défilement.
Avec align="left"
vous alignez le cadre incorporé à gauche. Le texte qui suit passe à droite autour du cadre. Avec align="right"
vous alignez le cadre incorporé à droite et le texte qui suit passe à gauche autour du cadre. Cet attribut est cependant classé en cours d'abandon et peut être remplacé par la propriété CSS text-align
(par exemple <iframe style="text-align:left">
).
Avec scrolling="yes"
vous pouvez forcer que le cadre incorporé soit pourvu de barres de défilement, avec scrolling="no"
l'empêcher. scrolling="auto"
peut être également mentionné mais correspond au réglage par défaut.
Avec frameborder="0"
vous pouvez empêcher que la bordure extérieure du cadre incorporé soit visible. frameborder="1"
est le réglage par défaut.
Deux autres attributs, à savoir hspace=
et vspace=
, sont également interprétés par l'Explorer Internet mais ne font pas partie dans ce contexte du standard HTML - ce qui est quelque peu incongru étant donné que l'attribut align
a exactement le même effet pour de tels cadres que pour les graphiques et les objets. Avec hspace=
[pixels] vous déterminez l'espace entre le cadre incorporé et le texte passant à son côté, avec vspace=
[pixels]
l'espace entre le cadre et le texte qui se situe au dessus ou au dessous (hspace = horizontal space = espace horizontal, vspace = vertical space = espace vertical). Cependant les deux mentions génèrent du code HTML invalide.
Exactement comme pour les cadres normaux, existe aussi pour les cadres incorporés la possibilité de référencer avec l'attribut longdesc=
un long descriptif pour fenêtre cadre .
Dans un fichier HTML dans lequel vous définissez un cadre incorporé, vous pouvez aussi grâce à des liens modifier le contenu du cadre incorporé.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Texte du titre</title> </head> <body> <h1>Télécommande</h1> <iframe src="pagedaccueil.htm" name="hublot" width="500" height="400" marginheight="10" marginwidth="10" align="right"> <p>Votre navigateur ne peut malheureusement pas afficher de cadre incorporé</p> </iframe> <p> <a href="bienvenue.htm" target="hublot"><b>autre page</b></a><br> <a href="pagedaccueil.htm" target="hublot"><b>première page</b></a> </p> </body> </html> |
La condition pour des liens à un cadre incorporé est que le cadre
incorporé ait reçu un nom avec name=
. Dans l'exemple ci dessus, ce nom est hublot
.
Pour poser un lien au cadre incorporé, respectez les règles habituelles pour référencer en HTML. Afin que la cible du lien soit affichée dans le cadre, notez en plus dans le repère d'ouverture du lien la mention target=
(target = cible). Derrière suit le nom de la fenêtre cadre dans laquelle la cible du lien doit être affichée.
Cadres pour faciliter la mise en page | |
Liens à des cadres | |
SELFHTML/Aides à la navigation HTML/XHML Cadres |
© 2001 Stefan Münz / © 2003 Traduction Serge François, 13405@free.fr
selfhtml@fr.selfhtml.org