Exercice 1/25

  • Dans le fichier stylesheet.css, attribuez à tous les éléments html une bordure de 1px en trait plein avec la couleur #0066ff;
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Leçon 1/25

Maîtriser la position des éléments HTML vous permet d'avoir un contrôle très précis sur le rendu final de vos pages web. Les éléments de type bloc (div, h1, table, p, etc.) ne s'empileront plus forcément les uns sur les autres (à moins que vous ne le souhaitiez).

Chaque élément HTML agit donc comme un conteneur qui peut contenir soit d'autres éléments html soit du texte brut.

Cet exercice propose une illustration du modèle de boîte et les propriétés CSS associées : border, padding, margin. Vous avez utilisé border dans les exercices précédents, vous verrez les autres dans les exercices suivants.

Commentaires les mieux notés

84 Commentaires

  • beaussartpaul-62

    beaussartpaul-62

    bonjour je ne peux plus soumettre et je ne vois plus non plus le resultat du code en dessous

    le 05/04/2022 à 12h51

  • meriam

    meriam Admin

    Bonjour, votre dernier code est correct.

    le 06/04/2022 à 19h41

  • beaussartpaul-62

    beaussartpaul-62

    bonjour, le bouton soumettre ne fonctionne pas.

    le 04/04/2022 à 14h25

  • meriam

    meriam Admin

    Bonjour, le bouton fonctionne correctement, n'hésitez à me dire si le problème persiste encore chez vous.

    le 05/04/2022 à 20h41

  • beaussartpaul-62

    beaussartpaul-62

    bonjour, le bouton soumettre ne fonctionne pas.

    le 04/04/2022 à 07h31

  • meriam

    meriam Admin

    Bonjour, le bouton fonctionne correctement, n'hésitez à me dire si le problème persiste encore chez vous.

    le 05/04/2022 à 20h49

  • ahlem379-84

    ahlem379-84

    Bjr, dsl mais je n'y arrive pas ! j'ai 1 panneau ! sur la ligne * et 1 croix sur la ligne du code ! voici le ma réponse : * { border: 1px solid color: #0066ff; }

    le 17/02/2022 à 10h37

  • meriam

    meriam Admin

    Bonjour, il faut pas ajouter un ; entre les valeurs de la propriété border.

    le 17/02/2022 à 10h58

  • meriam

    meriam Admin

    Pour la couleur de border, il suffit d'ajouter le code hexa comme valeur de la propriété border.

    le 17/02/2022 à 10h59

  • meriam

    meriam Admin

    border est une propriété raccourcie avec la quelle on peut ajouter l'épaisseur le style de trait et la couleur.

    le 17/02/2022 à 11h01

  • ahlem379-84

    ahlem379-84

    Bjr, dsl mais je n'y arrive pas ! j'ai 1 panneau ! sur la ligne * et 1 croix sur la ligne du code !

    le 17/02/2022 à 10h37

  • meriam

    meriam Admin

    Bonjour, il supprimer la lettre h inutile aprés l'accolade fermante du sélecteur.

    le 17/02/2022 à 11h00

  • ahlem379-84

    ahlem379-84

    Bjr, j'ai 1 msg d'erreur, je ne comprends pas ! * { border:1px solid; color:#0066ff; } de l'aide svp!

    le 08/02/2022 à 09h40

  • meriam

    meriam Admin

    Bonjour, il faut laisser un espace entre les les valeurs de la propriété border (n'ajoutez pas un point-virgule aprés la valeur solid)

    le 08/02/2022 à 10h13

  • elodie97

    elodie97

    bonjour je ne peux rien faire depuis quelque jours ca me dit que mon script mets trop de temps à s'executer

    le 24/01/2022 à 09h01

  • meriam

    meriam Admin

    Bonjour, vous devez utiliser le sélecteur universel * (qui permet de sélectionner tous les éléments html de la page)

    le 25/01/2022 à 09h33

  • paulmonhurel95-28

    paulmonhurel95-28

    Bonjour, j'ai ce message d'erreur : Il vous manque la règle css pour tous les éléments html.

    le 08/12/2021 à 14h17

  • meriam

    meriam Admin

    Bonjour, il faut supprimer les points virgules que avez ajouté aprés l'accolade ouvrante du sélecteur;

    le 10/12/2021 à 14h40

  • YannLo

    YannLo

    Est-ce que c'est important pour les codes des couleurs de respecter la casse? (#0066ff = #0066FF ou pas?). Merci d'avance!#0066ff

    le 14/11/2021 à 16h28

  • meriam

    meriam Admin

    Bonjour, vous pouvez écrire en miniscule comme en majuscule.

    le 15/11/2021 à 10h10

  • YannLo

    YannLo

    Bonjour,

    le 14/11/2021 à 16h25

  • meriam

    meriam Admin

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

    le 15/11/2021 à 10h10

  • mischaparis1987-48

    mischaparis1987-48

    mon code : * { border: 1px solid; color: #0066ff; } ne fonctionnne pas...

    le 05/10/2021 à 12h28

  • meriam

    meriam Admin

    Bonjour, vous devez laisser un espace entre la couleur de la bordure et le style solid.

    le 08/10/2021 à 10h11

  • nils.dargent-63

    nils.dargent-63

    je comprend pas le &#123 car pour moi sa ne fonctionne pas avec

    le 03/03/2021 à 15h14

  • meriam

    meriam Admin

    Bonjour, remplacez le code { par {

    le 05/03/2021 à 07h42

  • Scar_BlueNote

    Scar_BlueNote

    Bonjour, depuis le chapitre précédent j'ai un problème d'affichage, le résultat est bon mais je n'arrive pas à observer ce qui se passe réellement. Est-ce un problème qui vient de mon pc?

    le 04/07/2020 à 16h46

  • meriam

    meriam Admin

    Bonjour, vous devez observez le résultat.

    le 06/07/2020 à 09h16

  • alexisyovo75-14

    alexisyovo75-14

    C'est bon j'ai pu voir analyser mon erreur.

    le 28/10/2019 à 12h09

  • christophe.gutierrez-64

    christophe.gutierrez-64

    le sélecteur universel est = *

    le 01/04/2019 à 10h36

index.html
stylesheet.css
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>Le voir pour le croire</title> </head> <body> <h3>Illustration du modèle de boîte en CSS</h3> <img src="http://www.w3.org/TR/CSS21/images/boxdim.png"> <p>Crédit: www.w3.org</p> </body> </html>