Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

Devoir de synthèse N°1 3ème SI (STI) Durée 2H Dans le but de promouvoir le tour

Devoir de synthèse N°1 3ème SI (STI) Durée 2H Dans le but de promouvoir le tourisme dans le blade vous êtes chargé de créer un site web qui présente les plus importants sites touristiques dans le pays. Questions : 1. Ouvrir l'éditeur web de votre choix vscode est fortement conseillé).(0.5 pts) 2. Ouvrir le dossier de travail documents\DS (0.5 pts) On donne les fichiers • index.html • reservation.html • globe.html • globe.css 3. Créer les fichiers (1pts) • main1.css (feuille de style pour affichage écran) • main2.css (feuille de style pour impression) • reservation.css NB o Afin de simplifier l'illustration sur la page des Question de l'examen on va supprimer les graphiques d'arrière- plan et les couleurs o Avant de commencer tout feuille de style ajouter a règle suivante au début de votre travail : o Respecter les dimensions et les marges des différents sections de la page illustré Site simplifier 4. Éditer les règles nécessaires pour mettre en forme la partie header de la page d'accueille comme c'est indiqué dans la capture d'écran et les indications suivantes : (2pts) ▪ Titre de niveau h1 ▪ Sous-titre de style h3 ▪ Image du drapeau aligné à gauche dans une forme elliptique ▪ Une hauteur de 12vh 5. Editer le style de La partie Nav de la page : (2pts) ▪ Une hauteur de 12vh ▪ La liste transformée en menue centré dans la section Nav ▪ Les boutons sont transformés en liens internes vers les sections de la partie Main *{ margin:0; padding:0; box-sizing: border-box; } ▪ La petite branche d'olive est bien dans cette partie et elle est positionné avec la valeur absolute de la propriété positions et retourné 45deg puis décalé pour prendre une bonne position 6. Editer le style de la partie main contenante : 1- La section Monastir et la section Sousse avec : (4pts) ▪ Un titre de style h3 coloré en bleu ▪ Cinq miniatures d'images alignées et centré (cliquables et possédant un effet hover) ▪ Une zone d'affichage principale avec une image de départ (en arrière-plan )de taille :200px 200px ▪ Un texte contenant plusieurs paragraphes possédant chacune une alinéa de 1.25 cm ❖ La section media : (2pts) ▪ Un Titre de style h3 et bleu ▪ Un cadre contenant une image centrée ❖ La section réservation (2pts) ▪ Un titre de style h3 et bleu ▪ Un frame permettant d'afficher la page inscription.html dans la disposition indiquée 5- Éditer le style de la partie footer (1pts) ▪ Un texte centré avec un effet d'ombre 6- Éditer le style du formulaire de réservation : (animation :1pts+3pts) o La légende de l'élément fildset contient une petite animation de globe et un titre o La taille de la fieldset est de 500px 450px o La taille du texte 18px o La hauteur des labels et des éléments input est 30px 7- Ajouter les arrières plans, les couleurs et les gradients linéaires comme c'est indiqué dans l'illustration si haut (2pts) 8- Éditer rapidement la feuille de style main2.css comme suivant pour pouvoir imprimer la page sur une seule feuille A4 (2pts) 9- Dès que la taille de la fenêtre atteint 660px le menue de la partie Nav change de style et affiche des boutons empilés les uns sur les autres de même taille et centré. Éditer la requête media nécessaire pour effectuer ce travail. @media @media ……………… and (max-width:………………..){ ……………… } uploads/s3/ devoir-de-synthese-n1.pdf