ED30 - P7 - Les cadres flottants : iframes

Transcription

ED30 - P7 - Les cadres flottants : iframes
Secteur Tertiaire Informatique
Filière étude - développement.
Développer des composants d’interface
Créer des pages WEB
HTML – Les cadres flottants : iframes
Accueil
Apprentissage
Période en
entreprise
Evaluation
CODE BARRE
SOMMAIRE
I PRESENTATION DES IFRAMES ..................................................................................................................... 3
II
EXERCICES D’APPLICATION...................................................................................................................... 3
II.1
EXO010-1 .................................................................................................................................................................................3
XXXX
afpa © 2008– Secteur Tertiaire Informatique Filière étude - développement
2 /6
I
PRESENTATION DES IFRAMES
Sur Internet Explorer, depuis la version 3.0, il est possible d’utiliser des cadres flottants, ce qui
permet d’ouvrir une fenêtre à n’importe quel endroit de votre page.
On utilise pour cela les balises <IFRAME>..</IFRAME>. Ces balises doivent être définies
entre les balises <BODY> et </BODY>.
Les attributs de la balise <IFRAME> sont les suivants :
Attribut
SRC
NAME
MARGINWIDTH
MARGINHEIGHT
FRAMEBORDER
BORDER
BORDERCOLOR
NORESIZE
SCROLLING
HEIGHT
WIDTH
Utilité
Indique l’url de la page html qui sera affichée dans la iframe.
Permet de donner un nom à la zone. Ce nom sera ensuite utilisé pour
identifier l’ iframe, à l’aide notamment de l’attribut TARGET
Valeur en pixel qui indique la taille des marges droite et gauche.
Valeur en pixel qui indique la taille des marges haute et basse.
Valeurs YES ou NO ; indique si les iframes ont une bordure visible.
Valeur en pixel qui indique la taille de la bordure des iframes.
Indique la couleur des bordures des iframes.
Empêche l’internaute de redimensionner les iframes. Par défaut, les
iframes sont redimensionnables.
Permet de définir une barre d’ascenseur pour l’iframe. Les valeurs
possibles sont :
YES : un ascenseur est toujours visible
NO : l’ascenseur n’est jamais visible
AUTO : l’ascenseur apparaît lorsqu’ il est nécessaire.
Définit la hauteur de l’iframe insérée dans la page.
Définit la largeur de l’iframe insérée dans la page.
Le texte contenu entre les balises <IFRAME> et </IFRAME> sera utilisé pour afficher un
texte de remplacement pour les navigateurs n’acceptant pas les iframes.
II EXERCICES D’APPLICATION
II.1 EXO010-1
Editer le programme suivant en mode texte (utiliser NOTEPAD).
Exécuter le programme avec le navigateur.
Rechercher la signification de chaque balise.
Page12.htm
<!-- douzième document de la progression HTML-->
<HTML>
<HEAD>
<TITLE>les Iframes</TITLE>
</HEAD>
<BODY>
<CENTER>
3/6
<P><H3>Deux formations en informatique sont proposées<H3></P>
<P><H3>à l'AFPA de Pont-de-claix.<H3></P>
</CENTER>
<BR>
<BR>
<HR>
<IFRAME src="page12-1.htm" ALIGN=left WIDTH=200 HEIGHT=100 SCROLLING=yes>
</IFRAME>
<IFRAME src="page12-2.htm" ALIGN=right WIDTH=200 HEIGHT=100 SCROLLING=yes>
</IFRAME>
<BR CLEAR=all>
<BR>
<BR>
<HR>
<P> Pour plus d'information contacter
<A href="mailto:[email protected]">[email protected]</A>
</P>
</BODY>
</HTML>
Page12-1.htm
<HTML>
<HEAD>
<TITLE>TSIG</TITLE>
</HEAD>
<BODY BGCOLOR=#FFFF00>
<P><H5>Développeur Informatique option Services Internet</H5></P>
<P>Détails de la formation : </P>
<P>BLABLABLABLABLABLABLABLABLABLA</P>
<P>BLABLABLABLABLABLABLABLABLABLA</P>
<P>BLABLABLABLABLABLABLABLABLABLA</P>
<P>BLABLABLABLABLABLABLABLABLABLA</P>
<P>BLABLABLABLABLABLABLABLABLABLA</P>
</BODY>
</HTML>
Page12-2.htm
<HTML>
<HEAD>
<TITLE>APIAI</TITLE>
</HEAD>
<BODY BGCOLOR=#FFFF00>
<P><H5>Développeur Informatique option Informatique industrielle et
embarquée</H5></P>
<P>Détails de la formation : </P>
<P>BLABLABLABLABLABLABLABLABLABLA</P>
<P>BLABLABLABLABLABLABLABLABLABLA</P>
<P>BLABLABLABLABLABLABLABLABLABLA </P>
4/6
<P>BLABLABLABLABLABLABLABLABLABLA</P>
<P>BLABLABLABLABLABLABLABLABLABLA </P>
</BODY>
</HTML>
5/6
Etablissement référent
AFPA Champs Sur Marne
Equipe de conception
J.C RIGAL
Reproduction interdite
Article L 122-4 du code de la propriété intellectuelle.
«toute représentation ou reproduction intégrale ou partielle faite sans le
consentement de l’auteur ou de ses ayants droits ou ayants cause est illicite. Il
en est de même pour la traduction, l’adaptation ou la reproduction par un art ou
un procédé quelconques.»
Date de mise à jour 2008
afpa © Date de dépôt légal mois année
afpa / Direction de l’Ingénierie13 place du Générale de Gaulle / 93108 Montreuil Cedex
association nationale pour la formation professionnelle des adultes
Ministère des Affaires sociales du Travail et de la Solidarité