Exercice 19/26

Dans l'onglet stylesheet.css

  • Attribuez à la balise ‹div›‹/div› la couleur #cc0000 à la propriété background-color en écrivant background-color: #cc0000;
  • Attribuez à la balise ‹div›‹/div› la valeur 100px à la propriété height en écrivant height: 100px;
  • Attribuez à la balise ‹div›‹/div› la valeur 100px à la propriété width en écrivant width: 100px;
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Leçon 19/26

La balise générique ‹div› permet de structurer une page web en blocs. Pour mieux les visualiser il est possible de leur appliquer les propriétés suivantes.

Pour cela, il faut choisir les valeurs de trois propriétés :

  • La couleur d'arrière-plan du bloc (background-color), pour laquelle vous choisissez une valeur hexadécimale.
  • La hauteur du bloc (height) que vous mesurez en pixels.
  • La largeur du bloc (width) en pixels également.

Les exercices ci-après vous donneront un bref aperçu des différents éléments HTML que vous pouvez sélectionner ainsi que quelques exemples de paires propriété:valeur (comme les trois présentées ci-dessus). Nous reviendrons plus en détail sur la sélection d'éléments HTML dans le prochain cours !

Commentaires les mieux notés

88 Commentaires

  • Jubecloe44-83

    Jubecloe44-83

    D'accord, merci pour l'aide :)

    le 14/03/2023 à 21h20

  • Jubecloe44-83

    Jubecloe44-83

    bonjour, bonjour ! pourriez-vous me dire mon erreur, s'il vous plait ?

    le 14/03/2023 à 11h41

  • Patricio M

    Patricio M Admin

    Passes la souris sur la croix rouge et tu verras ton erreur... il est assez bête

    le 14/03/2023 à 12h57

  • margauxbrassinais-93

    margauxbrassinais-93

    Il vous manque la règle css pour la balise div

    le 30/05/2022 à 13h24

  • meriam

    meriam Admin

    Bonjour, la classe margaux n'est pas demandée.

    le 30/05/2022 à 15h47

  • margauxbrassinais-93

    margauxbrassinais-93

    Bonjour, je ne trouve pas mon erreur/.margaux { color: #cc0000; background-color: #cc0000; height: 100px; width: 100px; }

    le 30/05/2022 à 13h24

  • meriam

    meriam Admin

    Bonjour, la classe que vous avez ajouté n'est demandée, il suffit de sélectionner l'élément div

    le 30/05/2022 à 15h36

  • Rubis.daisuki-69

    Rubis.daisuki-69

    Bonjour, c'est normal que c'est tout blanc ? Il n'y a rien du tout... (ça dit que l'exo est réussi néanmoins)

    le 08/03/2022 à 21h41

  • meriam

    meriam Admin

    Est ce que l'exercice est validé??

    le 10/03/2022 à 15h23

  • slitimyriam50-65

    slitimyriam50-65

    Bonjour je ne comprend pas mon erreur

    le 05/02/2022 à 21h31

  • meriam

    meriam Admin

    Bonjour, il faut pas ajouter des chevrons niveau sélecteur.

    le 07/02/2022 à 10h33

  • titedame-17

    titedame-17

    bonjour, pourquoi une police 2fois plus gros que 1.5em est egale à 2em et non 3em svp?

    le 24/11/2021 à 14h22

  • meriam

    meriam Admin

    Le fonctionnement de la propriété CSS font-size avec les em est simple : un élément HTML pour lequel on a demandé une taille de texte de Xem aura un texte dont la hauteur représente X fois la hauteur du texte de son élément parent.

    le 24/11/2021 à 14h41

  • j.koundour-65

    j.koundour-65

    bonjour le bouton soumettre ne fonctionne pas!!

    le 19/11/2021 à 11h30

  • meriam

    meriam Admin

    Bonjour, le problème du bouton est résolu.Merci pour votre compréhension.

    le 19/11/2021 à 13h55

  • meriam

    meriam Admin

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

    le 19/11/2021 à 13h56

  • khadidja

    khadidja

    div{ background-color: #cc0000; height: 100px; width: 100px; }

    le 05/10/2021 à 13h24

  • khadidja

    khadidja

    la bonne reponse:div { background-color: #cc0000; height: 100px; width: 100px; }

    le 05/10/2021 à 13h22

  • meriam

    meriam Admin

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

    le 08/10/2021 à 10h53

  • ferreira-celine2-75

    ferreira-celine2-75

    Bonjour, j'ai regardé dans le devTool si la bande orange sur ce site même était construite à partir d'une DIV. Peut-on également les rendre invisibles de façon à minimiser l'écriture du chemin que doit parcourir notre sélecteur dans .CSS dans le cas où nous aurions une très longue page? (longue page que nous souhaitons styliser différemment selon le haut/milieu/bas de page?

    le 26/08/2021 à 13h58

  • meriam

    meriam Admin

    Bonjour, j'ai pas compris votre question

    le 30/08/2021 à 02h57

  • bilismira-75

    bilismira-75

    C'est quoi l'erreur?

    le 13/06/2021 à 14h31

  • meriam

    meriam Admin

    Bonjour, vous devez créer un seul sélecteur div qui contient toutes les propriétés demandées.

    le 14/06/2021 à 11h46

  • flaviemichel12-74

    flaviemichel12-74

    tout est bon et sa ne marche pas

    le 30/03/2021 à 19h00

  • meriam

    meriam Admin

    Bonjour, vous devez ajouter les accolades pour le sélecteur div.

    le 30/03/2021 à 21h58

  • sarmientoflavio-62

    sarmientoflavio-62

    bonjour le bouton soumettre ne fonctionne plus et mes codes css ne s'applique pas à mon fichier html! aider svp

    le 10/03/2021 à 09h17

  • meriam

    meriam Admin

    Bonjour, le problème est réglé

    le 10/03/2021 à 14h11

  • fred.glemeau94-21

    fred.glemeau94-21

    bonsoir , miriam ou est l'erreu dans mon code ?

    le 26/02/2021 à 21h47

  • meriam

    meriam Admin

    Votre code est correct.

    le 02/03/2021 à 12h30

index.html
stylesheet.css
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>Couleur d'arrière-plan, hauteur et largeur</title> </head> <body> <div></div> </body> </html>
/*Ajoutez votre CSS ici !*/