Exercice 5/25

  • Dans le fichier stylesheet.css, changez la valeur de la propriété display à none pour tous les éléments div;
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Note:
Vous constaterez que avec la valeur none les éléments div ainsi que leur éventuel contenu disparaissent complètement de la page web. La place qu'ils occupent n'est pas conservée, si bien que si il y avait d'autres éléments html en-dessous, ils viendraient se repositionner à la place des div.

Leçon 5/25

La propriété "display" peut aussi prendre comme valeur "none" qui permet de ne pas afficher un élément sur la page web. Un élément HTML qui a cette valeur ne sera pas affiché sur la page et la place qu'il occupait sera libérée afin que les éléments HTML voisins puissent se positionner par rapport à l'emplacement libéré. La propriété "display" peut aussi prendre comme valeur "none" qui permet de ne pas afficher un élément sur la page web. Un élément HTML qui a cette valeur ne sera pas affiché sur la page et la place qu'il occupait sera libérée afin que les éléments HTML voisins puissent se postionner par rapport à l'emplacement libéré.

Commentaires les mieux notés

12 Commentaires

  • busing.eric-69

    busing.eric-69

    Bonjour, la leçon est écrite en deux fois sur cet exercice et d'autres aussi. Souhaitant vous en informer. Bonne journée

    le 26/01/2022 à 12h19

  • meriam

    meriam Admin

    Bonjour, merci pour votre attention.

    le 27/01/2022 à 09h21

  • alexandre.dutay-76

    alexandre.dutay-76

    Bonjour, j'ai le message d'erreur pour a plupart des exercices cet après-midi (boucle infinie)

    le 17/03/2021 à 12h20

  • meriam

    meriam Admin

    Bonjour, votre dernier code est correct.

    le 17/03/2021 à 13h24

  • fraviogarry-79

    fraviogarry-79

    oui, j'ai compris mais pourquoi mettre de code si finalement je vais le masquer

    le 10/07/2020 à 04h54

  • meriam

    meriam Admin

    Bonjour, il faut tester toutes les valeurs possible de la propriété display, si on cache un élément avec display : none on peut le réafficher une autre fois à un moment donné.

    le 10/07/2020 à 08h05

  • jmulon.pro

    jmulon.pro

    Erreur ?

    le 07/12/2017 à 14h35

  • mram

    mram Admin

    Bonjour, oui erreur devant le premier sélecteur CSS. Pas besoin de mettre *

    le 10/12/2017 à 12h33

  • armand1807

    armand1807

    bug d'affichage dans la partis leçon: il n'y a rien...

    le 28/07/2017 à 11h22

  • mram

    mram Admin

    Bonjour, c'est noté. J'ai fait remonté l'information.

    le 05/08/2017 à 05h50

Pour publier un commentaire, vous devez vous connecter.
index.html
stylesheet.css
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>None</title> </head> <body> <div id="un"></div> <div id="deux"></div> <div id="trois"></div> <div id="quatre"></div> </body> </html>
div { height: 50px; width: 100px; border: 2px solid black; border-radius: 5px; display: inline; } #un { background-color: #4D94FF; } #deux { background-color: #3385FF; } #trois { background-color: #1975FF; } #quatre { background-color: #0066FF; }
http://localhost:8080