Exercice 10/15

Cliquez sur Soumettre ma réponse pour conclure cette section et découvrir deux nouvelles balises proprement magiques : <div> et <span> !

Leçon 10/15

Faisons à nouveau le point sur vos connaissances !

Les compétences que vous avez acquises en HTML sont les suivantes :

  1. Insérer des commentaires dans votre code HTML avec <!-- et -->.
  2. Créer des listes ordonnées et non ordonnées avec <ol> et <ul> (et <li> </li>).
  3. Mettre en exergue des portions de texte en utilisant <em> et <strong> (italique et gras).
  4. Changer la couleur, la taille et l'alignement d'un texte avec l'attribut style.
  5. Construire des tableaux avec <table>, <tr>, <td>, <th>, <thead> et <tbody>

Commentaires les mieux notés

11 Commentaires

  • kodjovi.segnegbe.etu-93

    kodjovi.segnegbe.etu-93

    <!DOCTYPE html> <html> <head> <title>Les tableaux</title> </head> <body> <table style="border-collapse:collapse;"> <thead> <tr> <th colspan="2">Géants de l'internet par année de création</th> </tr> <tr style="border-bottom:1px solid black;"> <th style="padding:5px;">Géants de l'internet</th> <th style="padding:5px;border-left:1px solid black;">Année de création</th> </tr> </thead> <tbody> <tr> <td style="padding:5px;">Facebook</td> <td style="padding:5px;border-left:1px solid black;">2004</td> </tr> <tr> <td style="padding:5px;">Google</td> <td style="padding:5px;border-left:1px solid black;">1998</td> </tr> <tr> <td style="padding:5px;">Amazon</td> <td style="padding:5px;border-left:1px solid black;">1994</td> </tr> </tbody> </table> </body> </html>

    le 24/12/2021 à 13h00

  • meriam

    meriam Admin

    Votre code fonctionne correctement

    le 26/12/2021 à 23h04

  • alinepascal-53

    alinepascal-53

    Merci pour le tableau !

    le 08/07/2019 à 13h07

  • sonnychaprier

    sonnychaprier

    bonjour, j'ai pris le temps de faire un schéma récapitulatif pour nos camarades les plus débutants, je pense que l'on comprend toujours mieux avec un schéma récapitulatif :) http://image.noelshack.com/fichiers/2018/01/7/1515330180-shema-tableau.png

    le 07/01/2018 à 12h05

  • mram

    mram Admin

    Bonjour, merci c'est gentil :) Si ça peut en aider d'autres à mieux visualiser la structure des tableaux HTML c'est bien.

    le 11/01/2018 à 23h12

  • mram

    mram Admin

    Sémantiquement ce n'est pas correct car là on mélange 2 façons de présenter du contenu : les "tables" servent pour présenter des données tabulaires organisées en lignes et colonnes (comme dans Excel), les "listes" sont faites pour présenter des listes d'éléments (comme une liste de courses). Il nous viendrait pas vraiment à l'idée de mettre sa liste de course sous forme de tableau Excel.

    le 05/10/2016 à 20h40

  • rochardo

    rochardo

    Peut-on envisager un truc dans le style : <tr> <ol> <li><td>whatever</td><li> <li><td>whatever</td><li> </ol> </tr> et si non pourquoi ? d'avance merci

    le 03/10/2016 à 17h41

Pour publier un commentaire, vous devez vous connecter.
index.html
<!DOCTYPE html> <html> <head> <title>Les tableaux</title> </head> <body> <table style="border-collapse:collapse;"> <thead> <tr> <th colspan="2">Géants de l'internet par année de création</th> </tr> <tr style="border-bottom:1px solid black;"> <th style="padding:5px;">Géants de l'internet</th> <th style="padding:5px;border-left:1px solid black;">Année de création</th> </tr> </thead> <tbody> <tr> <td style="padding:5px;">Facebook</td> <td style="padding:5px;border-left:1px solid black;">2004</td> </tr> <tr> <td style="padding:5px;">Google</td> <td style="padding:5px;border-left:1px solid black;">1998</td> </tr> <tr> <td style="padding:5px;">Amazon</td> <td style="padding:5px;border-left:1px solid black;">1994</td> </tr> </tbody> </table> </body> </html>
http://localhost:8080