TP 3 HTML5

Exercice 1
▪ Réaliser le tableau ci-dessous avec les contraintes suivantes :
• Celui-ci doit être centré dans la page et occuper le 40% de la largeur de la fenêtre du
navigateur
• Largeur des bordures : 6 pixels (attribut CELLSPACING=)
• Épaisseur de l’ombrage : 2 pixels (attribut BORDER=)
• Détachement du texte par rapport aux bords : 4 pixels (attribut CELLPADDING=)
• La première ligne est l’entête du tableau avec une couleur d’arrière-plan “silver”
• Le titre du tableau est “Exercice 01 “
• Réaliser l’alignement du texte suivant les données des cellules
• Placer une légende au bas du tableau
• Les balises </TR>, </TH>, </TD> sont facultatives, mais il vaut mieux les mettre

Exercice 2

Créer le tableau suivant en utilisant les propriétés de fusion "colspan" et "rowspan" :

Exercice 3

Utiliser les éléments : caption, thead, tbody et tfoot pour afficher les données dans un tableau
structuré de la façon suivante :

Exercice 4
On souhaite créer une page Web qui ressemble à ceci :

• Accueil Exercice
• Présentation Cet exercice permet de mettre en pratique les balises que nous avons
• Activités vu jusqu'ici.
N'attendez pas à ce que le design soit épatant ! En effet, il reste
• Contact encore du chemin à faire avant de réussir une page Web parfait avec
un design agréable.

Webmaser

• La police utilisée est "verdana", sauf pour les liens qui ont la police par défaut.
• Le code de la couleur utilisée pour le titre est #003569.
• L'image de la bannière (arr_bannp.png) mesure 100% de la page.
• Le menu est structuré sous forme de liste.
• Le menu contient des liens vers les pages accueil.html, presentation.html, activites.html et
contact.html.
 • Le code de la couleur d'arrière-plan du menu est #EEEEEE
• Le code de la couleur d'arrière-plan du bas de page est #FF6600

Exercice 5

Ecrire le code qui permet de réaliser la page suivante en utilisant l’image sbe.jpg :