Exercice 9/15

  • Mettez les titres des colonnes "Géants de l'internet" et "Année de création" en italique
  • Mettez le titre du tableau "Géants de l'internet par année de création" en rouge

Leçon 9/15

Vous commencez à savoir faire des tableaux un peu compliqués mais ce n'est qu'un début. Nous avons amélioré son apparence qui n'était pas des plus esthétiques et on vous laisse carte blanche pour les finitions !

Amusez-vous avec les attributs de style que nous avons insérés, en jouant sur les propriétés CSS que vous connaissez déjà. Nous en verrons davantage très bientôt.

Pour appliquer plusieurs styles à un même élément, séparez-les par un point-virgule, comme ceci :

 <th style="font-size:14px;color:blue"></th>

_

Retournez à la section précédente Texte en italique pour voir comment ajouter du style à un texte.

Par exemple, essayez d'ajouter un attribut de style au premier th pour changer sa couleur. C'est le même principe que pour changer la couleur de la police avec l'attribut style.

_

Commentaires les mieux notés

215 Commentaires

  • hadjerbenhadid86-74

    hadjerbenhadid86-74

    Bonjour, pourquoi je dois mettre une balise <em> à l'interieure de <th>

    le 12/02/2023 à 15h46

  • Patricio M

    Patricio M Admin

    Hadjer, tu dois écrire le texte en italique... et <em> sert à écrire en italique

    le 13/02/2023 à 14h07

  • barraille.olivier-60

    barraille.olivier-60

    au com précedent vous dites l'attribut style doit être dans la balise ouvrante tr.l'attribut style doit être dans la balise ouvrante tr. or le message d'erreur me dit qu'il doit être dans th je ne trouve pas mon erreur

    le 02/02/2023 à 05h02

  • Patricio M

    Patricio M Admin

    Chez moi ça passe. Pourquoi tu as changé les couleurs des th?? Le style RED doit être dans la meme ligne que colonne span 2

    le 02/02/2023 à 11h04

  • barraille.olivier-60

    barraille.olivier-60

    j'obtiens ce message = Avez-vous bien placé l'attribut style dans la balise <th> (1er <tr> )? comment mettre en italique autrement qu'avec <em> ?

    le 28/01/2023 à 01h20

  • Patricio M

    Patricio M Admin

    Fait attention à l'imbrication des <trow, tdata, thead> et tu veras l'erreur

    le 01/02/2023 à 15h46

  • kellylecardinal-67

    kellylecardinal-67

    jai fais la meme chose avec un espace je trouve pas mon erreur

    le 04/03/2022 à 13h29

  • meriam

    meriam Admin

    l'attribut style doit être dans la balise ouvrante tr.

    le 06/03/2022 à 21h54

  • sabine.buffon-94

    sabine.buffon-94

    Bonjour, a cette remarque : Avez-vous bien placé l'attribut style dans la balise <th> (1er <tr> )? je réponds oui thead> <tr> <th colspan="2";style="color:red">Géants de l'internet par année de création</th> </tr> Où se situe le problème ?

    le 11/02/2022 à 14h53

  • meriam

    meriam Admin

    Bonjour, il faut laisser un espace avant l'attribut style et il faut supprimer le point-virgule.

    le 11/02/2022 à 15h23

  • meriam

    meriam Admin

    On sépare les différents attributs par un espace (pas un point-virgule)

    le 11/02/2022 à 15h24

  • delcroixnicolasj-72

    delcroixnicolasj-72

    Bonjour, la vérification m'indique que "Pour la balise <th> (1er <tr> du <thead>), vous devez avoir le texte "Les géants de l'internet par année de création", pourtant il me semble que c'est cela, je ne vois pas où est le prôblème.

    le 01/02/2022 à 00h21

  • meriam

    meriam Admin

    Bonjour, il faut éliminer la balise <em>

    le 01/02/2022 à 11h18

  • laurentrousselpro-16

    laurentrousselpro-16

    Bonjour je ne comprends pas mon erreur ça fais 20m je suis dessus

    le 04/01/2022 à 10h34

  • meriam

    meriam Admin

    Bonjour, au niveau de la 1 ère ligne de thead, il faut supprimer la balise p que avez ajouté.

    le 04/01/2022 à 10h57

  • meriam

    meriam Admin

    Il faut intégrer la l'attribut style à l'intérieur de la balsie th (sana passer par p)

    le 04/01/2022 à 10h58

  • tristandu1971-58

    tristandu1971-58

    <!DOCTYPE html> <html> <head> <title>Les tableaux</title> </head> <body> <table style="border-collapse:collapse;"> <thead> <tr> <th colspan="2" style="color:red">Géants de l'internet par année de création</th> </tr> <tr style="border-bottom:1px solid black;"> <th style="padding:5px;"><em>Géants de l'internet</em> <th style="padding:5px;border-left:1px solid black;"><em>Année de création</em> </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 22/12/2021 à 12h30

  • meriam

    meriam Admin

    Bonjour, quel est votre question exacetement ??

    le 22/12/2021 à 14h06

  • meriam

    meriam Admin

    Bonjour, quelle est votre question exacetement ??

    le 22/12/2021 à 14h07

  • gaellaurent-89

    gaellaurent-89

    Bonjour, le bouton soumettre ne fonctionne pas, merci

    le 20/12/2021 à 13h41

  • gaellaurent-89

    gaellaurent-89

    Bonjour, le bouton soumettre ne fonctionne pas, merci

    le 20/12/2021 à 13h41

  • meriam

    meriam Admin

    Bonjour, le bouton soumettre fonctionne corectement.

    le 20/12/2021 à 15h25

  • gaellaurent-89

    gaellaurent-89

    Bonjour, le bouton soumettre ne fonctionne pas, merci

    le 20/12/2021 à 13h41

  • meriam

    meriam Admin

    Bonjour, votre code fonctionne correctement.

    le 20/12/2021 à 15h49

  • gaellaurent-89

    gaellaurent-89

    Bonjour, le bouton soumettre ne fonctionne plus, merci

    le 20/12/2021 à 13h36

  • meriam

    meriam Admin

    N'hésitez pas à demander de l'aide si vous trouvez des problèmes dans les exercices suivants.Bon travail.

    le 20/12/2021 à 15h48

  • gaellaurent-89

    gaellaurent-89

    Bonjour, le bouton soumettre ne fonctionne plus, merci

    le 20/12/2021 à 13h36

  • meriam

    meriam Admin

    Bonjour, quel est le message d'erreur affiché?

    le 20/12/2021 à 15h48

  • chloe.doliveira-96

    chloe.doliveira-96

    Bonsoir, je continue à avoir cette notification : Pour la balise <th> (1er <tr> du <thead>), vous devez avoir le texte "Les géants de l'internet par année de création". alors que j'ai beau vérifié mais mon code est correct

    le 09/12/2021 à 16h42

  • meriam

    meriam Admin

    Bonjour il faut supprimer l'espace avant la balise fermante </th>

    le 13/12/2021 à 11h16

  • stephanie.cartalier-29

    stephanie.cartalier-29

    <tr> <th colspan="2"; style="color:red"><em>Les géants de l'internet</em> par <em>année de création. </em></th> </tr>

    le 07/09/2021 à 13h04

  • meriam

    meriam Admin

    Mettez le titre du tableau "Géants de l'internet par année de création" en rouge ==><th colspan="2"; style="color:red">Les géants de l'internet par année de création</th>

    le 09/09/2021 à 08h47

  • meriam

    meriam Admin

    Mettez les titres des colonnes "Géants de l'internet" et "Année de création" en italique ==><th style="padding:5px;"><em>Géants de l'internet</em></th> <th style="padding:5px;border-left:1px solid black;"><em>Année de création</em></th>

    le 09/09/2021 à 08h48

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