Expert-Lab Technologie
Centre d’excellence de formation professionnel en informatique – Gestion- Compta &Langues
Formation – certification – stage - Emploi
Tel : 77 77 17 19 / 66 12 20 50
Créer un dossier avec votre nom et prénom et enregistrer les fichiers
nécessaires à l’intérieur.
Projet HTML
Vous êtes un Webmaster dans une entreprise de digitalisation et à la recherche scientifique. Votre
mission est de faire la conception d’un site web avec HTML & CSS pour l’un de ses clients, à cet
effet voici les différentes recommandations du client :
1. Réaliser une page HTML avec le nom ACCUEIL.HTML
2. Insérer un titre avec ce texte « MICROSOFT, GEANT DE L’INFORMATIQUE »
et appliquer la mise en forme suivante : police : Showcard Gothic ; taille : 65px ; couleur :
white ; alignement : centré et souligner ;
3. Insérer un paragraphe avec ce texte « Microsoft est une multinationale informatique
et micro-informatique américaine, dont l’activité est principalement la vente de
logiciels, de systèmes d’exploitation et d’électronique grand public.
L’entreprise propose des produits connus mondialement, comme la suite Office
(Excel, Word…) leur système d’exploitation Windows ou encore la Xbox.
L’entreprise fait partie des principales capitalisations boursières du NASDAQ,
avec 2102 milliards de dollars de capitalisation. » puis appliquer cette mise en forme :
police : footlight mt light ; taille : 25px ; couleur : white et mettre en gras ;
4. Insérer trois vidéos à la même ligne et appliquer 33% de largeur à toutes les vidéos.
5. Insérer deux liens comme suite (1er lien pour ouvrir la page SERVICE et le dernier pour
ouvrir la page FORMULAIRE).
6. Réaliser une deuxième page HTML avec le nom SERVICE.HTML
7. Insérer le même titre de la page accueil avec la même mise en forme.
8. Réaliser une liste ordonnée (type : I) avec ces trois informations (Afrique, Europe et Asie)
9. Compléter la liste en ajoutant trois pays pour chaque contient avec des listes non
ordonnées des types différents.
10. Appliquer aux listes : police : rockwell ; taille : 30px ; couleur : white ;
11. Créer un tableau de cinq lignes et quatre colonnes.
a. Fusionner les deux premières cellules et les deux dernières cellules de la première
ligne.
b. Fusionner les cellules de la dernière ligne.
c. Remplir les cellules avec des informations au choix
d. Bordure extérieure : double 15px et red ;
e. Bordure extérieure : solid 15px et black ;
f. Coller toutes les bordures ;
g. Appliquer la police : rockwell ; taille : 30px ; couleur : white ; alignement ; centrer ;
12. Insérer deux images à la même ligne en bas du tableau, de largeur 49% et hauteur 600px ;
13. Insérer deux liens comme suite (1er lien pour ouvrir la page ACCUEIL et le dernier pour
ouvrir la page FORMULAIRE)
14. Réaliser une troisième page HTML avec le nom FORMULAIRE.HTML
15. Créer un formulaire avec deux légendes de la manière suivante : Informations essentielles
& Information à choix unique et multiple ;
16. A l’intérieur de la première légende, établir les requêtes suivantes : Nom et Prénom
(maximum : 30 caractères) ; Age (entre 18 et 55) ; Email ; Numéro de téléphone ; Photo
de la pièce ;
17. Dans la deuxième légende, créer les options suivantes :
a. Niveau d’étude (sous forme de liste déroulante) : BAC ; LICENCE ; MASTER ;
b. Situation (Choix unique) : Etudiant(e) ; Professionnel(le) ; Autre ;
c. Langue parlée (choix multiple) : Arabe ; Français ; Anglais ; 18. Créer un bouton
VALIDER et un bouton REINITIALISER ;
19. Mise en forme du formulaire :
a. Encadrer les légendes avec une bordure différente
b. Appliquer aux légendes la police : footlight mt light ; taille : 25px ; couleur :
orange ; gras ; alignement : centré ;
c. Appliquer aux requêtes police : footlight mt light ; taille : 25px ; couleur : noire ;
gras ; alignement : centré ;
20. Insérer deux liens comme suite (1er lien pour ouvrir la page ACCUEIL et le dernier pour
ouvrir la page SERVICE)
21. Changer l’arrière-plan des pages en deux (navy, aqua) ;
