Remerciez-le!

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

TP numéro 2 de Langages Web HTML et CSS 1 Tableau et CSS Réaliser un tableau co

TP numéro 2 de Langages Web HTML et CSS 1 Tableau et CSS Réaliser un tableau comme celui de la ﬁgure 1 (le contenu est donné par le ﬁchier tab.txt) en respectant les règles suivantes : — la case « Accents » s’étend sur 4 lignes et la case « Monnaies » sur 2 ; — il occupe 75 % de la largeur de la fenêtre et il est centré dans la page ; — les cellules de données sont séparées par des bordures en pointillés rouges de largeur 1 pixel ; — la bordure extérieure du tableau est noire, continue et fait 3 pixels de large ; — les bordures des cellules sont fusionnées ; — le texte est distant de 5 pixels du bord pour les cellules d’en-tête (cellules de la première ligne) et de 2 pixels pour les autres cellules ; — dans les cellules d’en-tête, le texte doit être en gras et en petites majuscules ; — la première lettre de la légende du tableau (« Tableau 1. . . ») doit être une fois et demie plus grande que les autres ; — le texte est centré dans toutes les cases, sauf pour les commentaires de la dernière catégorie, aligné à gauche ; — les cellules des 2e et 4e colonnes ont un fond gris ; — lors du survol d’une case, les commentaires de la catégorie s’aﬃchent en blanc sur fond noir avec une bordure blanche (voir ﬁgure 2). Remarques : — il n’est pas nécessaire d’utiliser des identiﬁants ou des classes dans cet exercice ; — on structurera le tableau avec deux éléments tbody (un pour chaque catégorie). Figure 1 – Le tableau à réaliser. Figure 2 – Style appliqué lors du survol d’une case. 1 2 Image réactive Aﬃcher dans une page HTML l’image carte.png contenue dans l’archive tp2.zip et déﬁnir une balise <map> associée à cette image de sorte que chacune des zones colorées pointe vers une page diﬀérente (il n’est pas demandé de créer les pages cibles, il faut juste que les zones soient cliquables). 3 Une feuille de style pour votre page personnelle Créer une feuille de style pour la page HTML créée lors du TP 1, dans un ﬁchier externe. Utiliser la mise en forme suivante : — la couleur par défaut du texte est vert foncé (green) ; — les titres sont en police Voor (fournie avec le sujet) ou serif si celle-ci n’est pas disponible ; — les listes non ordonnées s’aﬃchent avec des puces carrées ; — les listes ordonnées sont numérotées avec des chiﬀres romains en majuscules ; — les images sont centrées ; — les sections ont une bordure continue bleu marine de 3 pixels à gauche et s’aﬃchent sur fond bleu pâle (utiliser la notation HSL avec une teinte de 120, une saturation de 100 % et une luminosité de 98 %) ; — le menu de navigation s’aﬃche sur fond jaune pâle (teinte : 60, saturation : 100 %, luminosité : 90 %) ; — les sections et le menu de navigation ont une marge intérieure de 1 em et une marge extérieure de 2 em ; — le coin supérieur gauche des sections et du menu est arrondi, avec un rayon de 50 pixels ; — quand on survole une équation : — les nombres s’aﬃchent en noir (pour la première équation, le 2 s’aﬃchera en noir et le 0 en bleu) ; — le reste de l’équation s’aﬃche en rouge. 2 uploads/s3/ tp-2 1 .pdf