Scribd
Importer
711 vues3 pages

TP HTML5 : Création de Tableaux

Ce document présente plusieurs exercices sur l'utilisation de balises HTML5 pour créer des tableaux, structurer des données et réaliser une maquette de page web avec menu et image.

Transféré par

ssss
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
711 vues3 pages

TP HTML5 : Création de Tableaux

Ce document présente plusieurs exercices sur l'utilisation de balises HTML5 pour créer des tableaux, structurer des données et réaliser une maquette de page web avec menu et image.

Transféré par

ssss
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

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 [Link], [Link], [Link] et
[Link].
• 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 [Link] :

Vous aimerez peut-être aussi