Comment faire un catalogue de produits avec HTML

Les tableaux constituent la méthode la plus simple pour créer un catalogue en ligne en HTML. Un tableau à trois colonnes vous donne de la place pour une image du produit, une description et des informations sur l'expédition/la commande. L'insertion d'informations dans des tableaux réduit le temps nécessaire pour justifier le texte. De plus, les tableaux vous permettent de contrôler l'espace blanc entourant les informations sur votre page afin d'améliorer l'apparence et la clarté de votre site Web.

Étape 1

Définissez un tableau avec une bordure d'un pixel à l'aide de l'ouverture

étiqueter:

Vidéo du jour

Étape 2

Insérez la première ligne de cellules et leur contenu avec ce code :

Étape 3

Insérez la deuxième rangée de cellules et leur contenu avec ce code :

Étape 4

Fermez le tableau avec la balise de fin :

Ceci est une description du premier élément. Cet article est actuellement disponible.
Ceci est une description du deuxième élément. Cet article est en rupture de stock.

Conseil

Cet exemple simple produit un tableau avec deux lignes et trois colonnes. La première colonne affiche une image de 60 x 60 pixels du produit à l'aide de l'étiquette. Les deuxième et troisième colonnes affichent la description du produit et les informations sur le stock. Notez que chaque ligne commence et se termine par la balise et que chaque élément de la ligne commence et se termine par une balise. Insérez autant de colonnes ou de lignes que nécessaire pour décrire votre produit.

Insérez la commande cellpadding immédiatement après la spécification de bordure dans la définition du tableau pour augmenter la quantité d'espace blanc entre les bordures du tableau et votre contenu. Par example,

crée un espace blanc de 10 pixels autour du contenu de chaque cellule du tableau.

les références

  • W3Schools.com: Tableaux HTML