Exercice 4/20

  • Dans le fichier stylesheet.css, attribuez à tous les paragraphes la couleur #00e5ee.
  • Dans le fichier stylesheet.css, attribuez à tous les paragraphes imbriqués dans un ‹div›‹/div› la couleur #cc0000. D'après vous, de quelle couleur apparaîtront-ils puisque vous leur avez déjà dit de prendre la couleur #00e5ee à l'étape 1 ? (Lisez l'astuce !)
  • Dans le fichier stylesheet.css, attribuez à tous les éléments HTML la bordure suivante : 1px dashed #3a5fcd
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Leçon 4/20

L'utilisation de sélecteurs peut paraître un peu complexe mais plus vous les utiliserez, plus vous vous sentirez à l'aise avec.

Dans cet exercice vous allez voir la notion de spécificité des sélecteurs CSS.

Sélectionner les balises ‹p› incluses dans les ‹div› est plus précis que sélectionner toutes les balises ‹p›. Ainsi, les paragraphes se trouvant en dehors des ‹div› seront bleu cyan et ceux à l'intérieur des ‹div› seront rouges. C'est la notion de spécificité des sélecteurs CSS.

Un sélecteur CSS plus précis qu'un autre sera donc prioritaire. C'est le cas dans cet exercice.

Commentaires les mieux notés

196 Commentaires

  • nicolasnanteau-24

    nicolasnanteau-24

    Bonjour, je ne comprends pas mon erreur.

    le 01/11/2022 à 20h48

  • Patricio M

    Patricio M Admin

    Nico, où est le * (SELECTEUR UNIVERSEL)

    le 02/11/2022 à 10h07

  • gilles.jamain2-80

    gilles.jamain2-80

    je ne comprends pas d'ou viens le pb ???

    le 20/10/2022 à 09h30

  • Patricio M

    Patricio M Admin

    Tu n'as pas écris un sélécteur universel... je vois d'autres, mais pas celui-ci

    le 20/10/2022 à 14h24

  • borz

    borz

    Bonjour, je ne comprends pas mon erreur

    le 19/05/2022 à 01h39

  • meriam

    meriam Admin

    Bonjour, pour le dernier sélecteur, il faut utiliser le sélecteur universel, laisser un espace entre les valeurs de la propriété border.

    le 19/05/2022 à 15h33

  • sandra12large-52

    sandra12large-52

    p { color: #00e5ee; } div p { color: #cc0000; } html { border: 1px dashed #3a5fcd; }

    le 16/05/2022 à 11h10

  • meriam

    meriam Admin

    Bonjour, votre code fonctionne correctement.

    le 17/05/2022 à 13h32

  • sandra12large-52

    sandra12large-52

    bonjour, je ne comprend pas mon erreur :

    le 16/05/2022 à 11h10

  • meriam

    meriam Admin

    Bonjour, pour le 3 ème sélecteur, vous devez utiliser le sélecteur universel.

    le 17/05/2022 à 13h33

  • ydliandarwati-45

    ydliandarwati-45

    Bonjour, je ne comprends pas cette exercice. * p { color:#00e5ee; } * div p { color:#cc0000; } * { border: 1px dashed #3a5fcd; }

    le 08/04/2022 à 08h44

  • meriam

    meriam Admin

    Bonjour, le 1 er sélecteur doit être p {} et le 2 ème doit être div p { }au lieu de *div p {}

    le 11/04/2022 à 16h10

  • alexis.moricci-50

    alexis.moricci-50

    C'est bon, j'ai trouvé mon erreur.

    le 07/04/2022 à 10h04

  • meriam

    meriam Admin

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

    le 07/04/2022 à 19h33

  • alexis.moricci-50

    alexis.moricci-50

    Bonjour, je ne comprends pas mon erreur. Quand je soumets, l'erreur est : Vous ne devez modifier qu'une propriété css de le sélecteur universel.

    le 07/04/2022 à 09h55

  • meriam

    meriam Admin

    Vous devez attribuer la propriété color et la valeur #00e5ee pour tous paragraphes.

    le 07/04/2022 à 19h33

  • pchaussade-7

    pchaussade-7

    Je ne comprends pas mon problème......

    le 03/03/2022 à 12h38

  • meriam

    meriam Admin

    Bonjour, pour le 1 et le 2 ème sélecteur, supprimez le point-virgule aprés l'accolade.

    le 03/03/2022 à 14h26

  • meriam

    meriam Admin

    pour le 3 ème sélecteur, remplacez le code suivant par une accolade ouvrante.

    le 03/03/2022 à 14h27

  • arakazaa.aa-21

    arakazaa.aa-21

    Bonjour,je ne comprends pas pourquoi on me dit "Vous devez modifier la propriété css border de le sélecteur universel"

    le 01/03/2022 à 14h13

  • meriam

    meriam Admin

    Bonjour, le 1 er sélecteur doit être sélectionner tous les paragraphes.

    le 01/03/2022 à 14h59

  • arakazaa.aa-21

    arakazaa.aa-21

    Bonjour,

    le 01/03/2022 à 14h12

  • meriam

    meriam Admin

    Bonjour, vous attribuer la couleur #00e5ee pour tous les paragraphes.

    le 01/03/2022 à 15h08

  • meriam

    meriam Admin

    Pour tous éléments, vous devez attribuer la bordure 1px dashed #3A5FCD;

    le 01/03/2022 à 15h09

  • terence.daco-16

    terence.daco-16

    Bonjour, pouvez-vous me dire si mon code est correct? Ca dit qu'il me manque la balise css pour la balise p

    le 05/02/2022 à 23h05

  • meriam

    meriam Admin

    Bonjour, vous avez une erreur au niveau du 1 er sélecteur ==> le bon sélecteur p { }

    le 07/02/2022 à 10h32

  • terence.daco-16

    terence.daco-16

    J'ia le même problème mais en cliquant plusieurs fois sur Activer Javascript, on peut avoir l'aperçu.

    le 05/02/2022 à 23h03

  • meriam

    meriam Admin

    Bonjour, pour le premier sélecteur, il faut sélectionner tous les paragraphes ==> p {}

    le 07/02/2022 à 10h31

  • marion.chedotal-93

    marion.chedotal-93

    pour information depuis fin janvier, l'aperçu du rendu des résultats quand on code dans la partie CSS n'apparait pas. Ce n'est pas du tout pratique pour voir l'intérêt de ce que l'on fait. Par contre, sur HTML on voit le rendu

    le 02/02/2022 à 11h08

  • meriam

    meriam Admin

    Bonjour, merci pour votre attention.

    le 03/02/2022 à 09h38

  • varion.lucie-83

    varion.lucie-83

    Bonjour je ne comprend pas mon erreur "Vous devez modifier la propriété css border de le sélecteur universel"

    le 30/01/2022 à 17h48

  • meriam

    meriam Admin

    Bonjour, pour attribuer à tous les éléments HTML la bordure suivante : 1px dashed #3a5fcd==> * {1px dashed #3a5fcd;}

    le 31/01/2022 à 11h07

  • meriam

    meriam Admin

    il faut attribuer à tous les paragraphes la couleur #00e5ee.

    le 31/01/2022 à 11h07

stylesheet.css
index.html
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>Faites bouger vos sélecteurs !</title> </head> <body> <p>Je vais revêtir une magnifique teinte de bleu.</p> <p>Moi aussi !</p> <p>Pareil, je n'ai pas de caractère alors je copie.</p> <div> <p>Et nous, on va mettre un super rouge !</p> <p>Je préfère plutôt bordeaux...</p> <p>Non, plutôt cramoisi !</p> </div> </body> </html>