Tutoriel des tableaux

•Tuto 1 : Les Tableaux

Avant de vouloir maitriser des supers codes qui changent complètement la page, la base du langage et des codes HTML réside dans des balises simples, celles des tableaux, sur ce sujet, vous allez apprendre facilement comment manipuler le code de "base" du langage HTML pour ainsi embellir vos sites web ou autre.

Tout d'abord, il faut savoir qu'un tableau se présente comme ceci.

case 1

case 2

Code:

•La base

Les balises "table" et "/table" signalent le début et la fin du tableau. elles seront donc les "limites" de votre tableau.

Les balises "tr" et "/tr" signalent une ligne de tableau, une ligne est horizontale et comprends à l'intérieur les cellules des cases, ou autrement dit les lignes verticales. Les balises "td" et "/td" signalent donc une "case" sur la ligne, ou une rangée verticale autrement appelée Colonne... Vous avez donc saisis le principe ? A l'intérieur d'une ligne appelée "tr" on peut avoir plusieurs case appelée "td". Par contre, il n'est pas possible d'inverser et de mettre des cases verticales dans des lignes horizontales.

•Le contour

Il existe des multitudes codes et améliorations pour un tableau, mais ici nous partirons dans du simple. Dans votre tableau, il est tout à fait possible de rajouter une bordure, ou autrement dit un "tour" pour ainsi soit le "fondre" dans le fond, soit au contraire le démarqué.

Exemple :

case 1

case 2

Code:

case 1

case 2

Montre un tableau ayant un pixel en forme de cadre. Il s'agit du tableau de base, que l'on peux générer en cliquant sur le bouton "Tableau" lors du poste d'un message sur le forum. Mais la valeur de la taille de la bordure est indiquée dans la première balise "table border="1", ici, le 1 détermine 1 pixel, on peut ainsi faire varier cette valeur, pour aller vers du 15 pixels.

case 1

case 2

ou carrément, supprimer le contour et ainsi avoir un tableau "fondu" dans le fond de page, en inscrivant la valeur "0" au lieu du 1 ou du 15 ci-dessus.

case 1

case 2

•l'alignement

Outre le nombre de ligne, case et la bordure, on peux également choisir la place de notre tableau sur notre page, prenons donc le code de base suivant pour un tableau simple à une ligne, deux cases et une bordure de 1 pixels.

case 1

case 2

Code:

case 1

case 2

On rajoute simplement "align= "center" comme ceci

Code:

case 1

case 2

case 1

case 2

Et nous possédons notre tableau au centre de la page. Il est bien entendu qu'au lieu d'avoir "center" nous pouvons avoir "left" pour le placer sur la gauche ou "right" pour le placer sur la droite.

Voici donc le premier tutoriel pour maitriser la base du code et ainsi pouvoir décorer de tableau vos pages, bien entendu ce n'est qu'un code de base et seul il vous sera surement d'aucune idée, mais il vous enseignera le minimum à savoir pour ne pas vous tromper dans l'élaboration de vos codes et de vos mises en pages ! A vous de jouer !