Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Défi : Travailler Avec Les Tableaux | Tableaux et Formulaires
Principes Fondamentaux du HTML

bookDéfi : Travailler Avec Les Tableaux

Tâche

Créer un tableau HTML pour afficher les éléments du menu d'un restaurant, y compris leurs noms, descriptions et prix. Remplir le tableau avec les données suivantes en utilisant la structure de tableau appropriée.

  1. Savory Bliss Bowl
    • Description: Quinoa, légumes rôtis, poulet grillé, sauce tahini ;
    • Prix : 12,99 $.
  2. Mediterranean Delight Wrap
    • Description : Fromage halloumi, épinards, tomates, tzatziki dans une galette ;
    • Prix : 10,49 $.
  3. Sizzling BBQ Burger
    • Description : Steak haché, bacon, cheddar, oignons caramélisés, frites ;
    • Prix : 13,99 $.
  4. Veggie Harvest Salad
    • Description : Légumes verts, patates douces, pois chiches, avocat, feta, vinaigrette ;
    • Prix : 9,99 $.
  5. Seafood Pasta Extravaganza
    • Description : Crevettes, pétoncles, moules, linguine, sauce au vin à l'ail ;
    • Prix : 16,99 $.
index.html

index.html

copy

Astuce

  • Étape 1 : Création de la structure du tableau à l'aide de la balise <table>. À l'intérieur du tableau, utilisation de la balise <thead> pour l'en-tête et de la balise <tbody> pour le corps du tableau. Dans la section <thead>, ajout d'une ligne (<tr>) avec des cellules d'en-tête (<th>) pour chaque colonne : Item, Description, et Price.
  • Étape 2 : Remplissage du tableau avec les éléments du menu en ajoutant des lignes (<tr>) dans la section <tbody>. Utilisation de cellules de données (<td>) dans chaque ligne (<tr>) pour spécifier les détails correspondants à chaque élément du menu.
index.html

index.html

copy

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 4. Chapitre 2

Demandez à l'IA

expand

Demandez à l'IA

ChatGPT

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Suggested prompts:

Can you show me the HTML code for the menu table?

Can you explain how to add more items to the table?

Can you help me style the table to look more attractive?

Awesome!

Completion rate improved to 3.13

bookDéfi : Travailler Avec Les Tableaux

Glissez pour afficher le menu

Tâche

Créer un tableau HTML pour afficher les éléments du menu d'un restaurant, y compris leurs noms, descriptions et prix. Remplir le tableau avec les données suivantes en utilisant la structure de tableau appropriée.

  1. Savory Bliss Bowl
    • Description: Quinoa, légumes rôtis, poulet grillé, sauce tahini ;
    • Prix : 12,99 $.
  2. Mediterranean Delight Wrap
    • Description : Fromage halloumi, épinards, tomates, tzatziki dans une galette ;
    • Prix : 10,49 $.
  3. Sizzling BBQ Burger
    • Description : Steak haché, bacon, cheddar, oignons caramélisés, frites ;
    • Prix : 13,99 $.
  4. Veggie Harvest Salad
    • Description : Légumes verts, patates douces, pois chiches, avocat, feta, vinaigrette ;
    • Prix : 9,99 $.
  5. Seafood Pasta Extravaganza
    • Description : Crevettes, pétoncles, moules, linguine, sauce au vin à l'ail ;
    • Prix : 16,99 $.
index.html

index.html

copy

Astuce

  • Étape 1 : Création de la structure du tableau à l'aide de la balise <table>. À l'intérieur du tableau, utilisation de la balise <thead> pour l'en-tête et de la balise <tbody> pour le corps du tableau. Dans la section <thead>, ajout d'une ligne (<tr>) avec des cellules d'en-tête (<th>) pour chaque colonne : Item, Description, et Price.
  • Étape 2 : Remplissage du tableau avec les éléments du menu en ajoutant des lignes (<tr>) dans la section <tbody>. Utilisation de cellules de données (<td>) dans chaque ligne (<tr>) pour spécifier les détails correspondants à chaque élément du menu.
index.html

index.html

copy

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 4. Chapitre 2
some-alt