Cours 14 : Faire un tableau en html

Ce tutoriel a été conçu par nos soins et est donc notre propriété exclusive. Toute ressemblance avec un autre existant ne serait que pure coïncidence. Il est interdit de recopier intégralement ou partiellement nos tutoriels qui sont exclusivement réservés aux membres de ce forum.

Pour ce cours nous allons apprendre à créer un tableau simple en html.
Les balises employées pour ce tutoriel sont :

- <table> est utilisé pour ouvrir votre tableau </table> en fin de tableau pour le fermer.

- border="1" se place dans la balise table. Si la valeur 1 est remplacé par 0 le tableau sera invisible. Plus la valeur est élevée plus le contour du tableau sera gros.

- <tr> représente chaque ligne horizontale de votre tableau.

- <td> représente chaque cellule d'un tableau.

- Ce genre de tableau peut avoir une utilisation simple pour vos sites. Quand vous désirez placer vos images sur une page et que vous voulez qu'elles soient correctement placé le tableau peut s'avérer utile. En plaçant une valeur 0 à border le tableau ne sera pas visible.

Nous allons donc maintenant faire un tableau en hmtl :
<center><table border="2"><tr><td>PC-design</td><td>formation html</td></tr><tr><td>correction en ligne</td><td>tutoriel</td></tr></table></center>

Ce qui nous donne ceci :

- Vous remarquerez que les cellules du tableau prennent la place du plus grand contenu. Si vous désirez placer de long textes ou des images de tailles différentes, la taille des cellules peut être définie afin que les cellules restent uniformes. Mais nous verrons ceci dans un autre tutoriel.

- J'ai délibérément placé la valeur border à 2 afin que le contour soit bien visible.

------------------------------------------------------------------------


Exercice 1 :

Pour ce premier exercice je vous demanderai de reproduire le même tableau du tutoriel. (Evitez le copier coller cela ne vous aidera pas à apprendre).


Exercice 2 :

Pour ce deuxième devoir nous allons voir si vous avez compris la base du tableau. Créez un tableau centré avec trois lignes et trois cellules par ligne et une valeur border à 2. Voir l'exemple ci-dessous:


Exercice 3 :

Pour ce troisème devoir nous allons compliquer un peu la donne. Reproduisez le tableau ci-dessous. Je ne donne aucune indication, à vous de trouver ce qui a changé :



Attention à la taille de la bordure. Les erreurs des premiers aideront les suivants à ne pas reproduire la même erreur. Mais c'est en faisant des erreurs qu'on apprend. Bonne chance.

Coucou,
Me revoilà, j'avais un peu laché désolée.... mais je n'ai pas perdu les cours déjà appris (normalement )
Exercice 1 :

PC-design	formation html
correction en ligne	tutoriel

Exercice 2 :

bienvenue	sur	PC-design
Cours	tutoriel	correction en ligne
Pour apprendre	comment fonctionne	le html en s'amusant

Exercice 3 :

bienvenue	sur	PC-design
Cours	tutoriel	correction en ligne
Pour apprendre	comment fonctionne	le html en s'amusant
PHENYX

Ouf ! fini ! par contre pour l'exercice 3 tu ne marques pas si tu veux le tableau centré ou pas alors du coup, ben je l'ai centré....

Bisous


Une petite erreur sur ton tableau de l'exercice 1. Ton dernier /tr tu as ecrit /r Cela peut semblé futile comme erreur mais si le tableau avait une ligne de plus ton tableau aurait été déformé. Je te demanderais donc de refaire le devoir 1 sinon si tu veux tu peux tous les refaire.

Bon je refais l'exercice 1:

PC-design	formation html
correction en ligne	tutoriel

Voilà je crois que c'est bon maintenant.
Par contre petite question, t'as dit qu'on pouvait faire éditer pour les messages, on fait comment ? stp
Merci



Super!! Alors par contre sur les devoirs non on ne peut éditer car si tu edites une fois que j'ai corrigé je risque de ne plus m'y retrouver.

Coucou,
Alors...on va tenter le coup....
EXERCICE 1:

PC-design	formation html
correction en ligne	tutoriel

EXERCICE 2:

Bienvenue	sur	PC-design
Cours	tutoriel	correction en ligne
Pour apprendre	comment fonctionne	le html en s'amusant

EXERCICE 3:

Bienvenue	sur	PC-design
Cours	tutoriel	correction en ligne
Pour apprendre	comment fonctionne	le html en s'amusant
PHENYX

Et voilà....merci d'avance pour la correction...je croise les doigts.
Bisous
Chrys

Merci encore, pour le temps passé pour la correction et pour le plaisir apporté par ces exercices!
bisous
Chrys