La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

Les frames Différencier :

Présentations similaires


Présentation au sujet: "Les frames Différencier :"— Transcription de la présentation:

1 Les frames Différencier :
Page de frame : définir les différentes zones de l'écran Pages de contenu : afficher à l'intérieur de la coquille vide. <frameset> : frames <frame> : contenu <html> <head> <title></title> </head> <frameset>    <frame> <frame>   </frameset> </html>

2 Exemple de frame <html> <head>
<title>Titre ds la barre de navigation</title> </head> <frameset cols="30%,70%"> <frame src="autrepage.html" name="frame1”/> <frame src="index.html" name="frame2”/> </frameset> </html> Pélissier C.

3 Attributs de frames <frameset rows="x%,y%,z%">
<frameset cols="x%,y%,*"> Barre de défilement : scrolling=« noIyes » Espace bord de la frame et le contenu : marginwidth=“55“ marginheight=“55“ Localisation des liens : <a href="page.htm" target="gauche"> Valeur de target : _self : Affiche la cible dans le même cadre que le lien _blank : Affiche la cible dans une nouvelle fenêtre _top : Affiche la cible dans la fenêtre entière du navigateur

4 Balises iframe et noframe
<iframe> : introduire une page au sein de votre document <iframe src=" align="left I right I center" > <iframe src=" height="600" width="800"> <frameset cols="30%,*"> <frame name="droit" src="toto.html"/> <frame name="gauche" src="tutu.html"/> <noframe>pas compatible avec les frames</noframe> </frameset>

5 Formulaires (1/4) <html>
<head> c’est un formulaire </head> <body> <p> salut </p> <form method="post" entype="text/plain »> <p align="left">Veuillez entrer votre mot de passe : </p> <input type="password" name="pass" size="9 »/> </br> <p>Votre date de naissance : </p> <input type="date" name="Naissance" size="8" maxlenght="8" value="jj/mm/aa »/> </br> </form> <p> au revoir et a bientôt </p> </body> </html> salut Veuillez entrer votre mot de passe : Votre date de naissance : au revoir et a bientot jj/mm/aa

6 Formulaires (2/4) <textarea name="Comment" cols="30" rows="10">
Entrez ici votre commentaire </textarea > <p align="left">Veuillez indiquer votre état civil : </p> </br> <input type="radio" name="EC" value="Monsieur" checked/> Monsieur</br> <input type="radio" name="EC" value="Madame"/>Madame </br> <input type="radio" name="EC" value="Mademoiselle"/>Mademoiselle</br> Veuillez indiquer votre état civil :  Monsieur  Madame Mademoiselle

7 Formulaires (3/4) <select name="destination" id="destination">
<option value="Paris"> Paris </option> <option value="Marseille"> Marseille </option> <option value="Lyon"> Lyon </option> </select> <select name="destination" id="destination"> <optgroup label=« France »> <option value="Paris"> Paris </option> <option value="Marseille"> Marseille </option> <option value="Lyon"> Lyon </option> </optgroup> </select> <input> type=«checkbox»

8 Formulaires (4/4) <legend> Situation actuelle </legend>
<input> type=«file» value=«parcourir» type=«submit» value=«envoyer» type=«image» src=«envoyer.jpg» type =«reset» value=«effacer» <fieldset> <legend> Situation actuelle </legend> <p align="left"><b>Veuillez indiquer votre situation familiale : </b><br> <ul><input type="Radio" name="EC1" Value="Célibataire"> Célibataire<br> <input type="Radio" name="EC1" Value="Marié" checked> Marié <br></ul> </fieldset>

9 Zones réactives liste.html liste.html <img src="guitariste.bmp" width=«1000» height=«1200» usemap="#toto"/> <map name="toto"> <area shape="circle" border="10" coords="500,100,100" href="liste.html"> </area> </map> Valeur de shape : « rect » pour rectangle : x1,y1,x2,y2 « circle » pour cercle : x,y,r « poly »  pour polygone : x1,y1,x2,y2 ... xn,yn à partir du haut et de la gauche TD 5


Télécharger ppt "Les frames Différencier :"

Présentations similaires


Annonces Google