Scribd Logo
Upload

Welcome to Scribd!

  • TD4 HTML Frames

    Uploaded by

    Øssama Ajbli
    18 views3 pages

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    18 views3 pages

    TD4 HTML Frames

    Uploaded by

    Øssama Ajbli

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 3

    Filière Première Année Cycle d'Ingénieur : Sécurité IT et Confiance Numérique

    Année Universitaire 2023-2024


    h.nassiri@uiz.ac.ma

    Technologie Web

    Les cadres (frames)

    1. Les frames
    – On peut diviser une fenê tre verticalement ou horizontalement en plusieurs parties
    pour former des cadres. Chacun correspond à une page. La mise en œuvre du jeu de
    cadres est ré alisé e par les balises <frameset> et <frame>.
    – La balise <frameset> dé clare de l'association de plusieurs cadres dans la zone
    d'afCichage. Les instructions <frameset> remplacent les instructions <body>d'une
    page classique.
    – La balise <frame> dé Cinit le contenu de chaque cadre.
    – La balise <noframes> permet de spé ciCier un texte à afCicher pour é viter les erreurs
    avec les navigateurs non compatible. L’é lé ment <noframes> doit contenir l’é lé ment
    <body>.

    2. Les attributs de la balise <frameset> :


    § cols (en pixels ou en pourcentage) : Cadre vertical.
    § rows (en pixels ou en pourcentage) : Cadre horizontal.
    § border="taille" : é paisseur de la bordure entre les cadres.
    § Bordercolor="couleur" : la couleur de la bordure des cadres.
    § frameborder="Yes/No" : indique si les cadres auront ou n'auront pas de bordure.
    § framespacing="pixels" : l'espace entre les cadres.

    NB : pour les attributs cols et rows Les dimensions sont sé paré es par des virgules. Il est
    possible d’utiliser le signe "*" pour indiquer que la colonne occupe l'espace restant et la
    valeur s'ajuste automatiquement.

    3. Les attributs de la balise <frame> :


    § src="url" : l'emplacement de la page à afCicher dans le cadre.
    § name="texte" : le nom du cadre.
    § scrolling="yes / no / auto" : attribuer ou non une barre de dé Cilement (scrollbar) à
    un cadre. L’option auto est (option par dé faut) laisse au navigateur le soin d'afCicher
    les barres de dé Cilement si besoin.

    1
    § marginheight="pixels" : taille des marges du haut et du bas cadre.
    § marginwidth="pixels" : taille des marges de gauche et de droite du cadre.
    § border="taille" : taille de l'espace entre les cadres.
    § noresize : interdire l'utilisateur de redimensionner les cadres.
    § frameborder="yes/no" : indique si les cadres auront ou n'auront pas de bordure.
    § border="valeur" : la taille des bordures entourant les cadres.
    § bordercolor="couleur" : la couleur de l'ensemble des bordures des cadres.

    4. Exemples
    Exemple 1 : Deux cadres verticaux
    <frameset cols="20%,80%">
    <frame src="frame1.html" name="gauche"></frame>
    <frame src="frame2.html" name="droite"></frame>
    </frameset>
    c
    Exemple 2 : Deux cadres horizontaux
    <frameset rows="20%,80%">
    <frame src="frame1.html" name="haut"></frame>
    <frame src="frame2.html" name="bas"></frame>
    </frameset>

    Exemple 3 : Deux cadres horizontaux et un vertical


    <frameset cols="20%, 80%">
    <frame src="frame1.html" name="gauche"></frame>
    <frameset rows="50%, 50%">
    <frame src="frame2.html" name="droit_haut"></frame>
    <frame src="frame3.html" name="droit_bas"></frame>
    </frameset>
    </frameset>

    Exemple 4 : Deux cadres verticaux et un horizontal.


    <frameset rows="100, *">
    <frame name="zone1" src="frame1.html">
    <frameset cols="20%, 80%">
    <frame name="zone2" src="frame2.html">
    <frame name="zone3" src="frame3.html">
    </frameset>
    </frameset>
    Exemple 5 : la balise <noframes>
    <frameset cols="20%, 80%">
    <frame src="frame1.htm" name="gauche">
    <frame src="frame2.htm" name="droite">
    </frameset>
    <noframes>
    <body>
    <p>We apologize. This HTML page requires a browser that
    supports frames. </p>
    </body>
    </noframes>

    2
    5. Exercice
    Donner le code HTML pour créer les frames suivants :

    – Le texte "Contact me" est un lien pour envoyer un mail à votre adresse.
    – Le texte "Google" est un lien qui s’affiche dans une nouvelle fenêtre et donc
    l'ancienne fenêtre reste toujours ouverte.
    – En cliquant sur chaque élément de la liste "Item 1", "Item 2", ou "Item3", le contenu
    s’affiche dans le cadre à droite comme la figure montre.

    You might also like