CSS : mettre en forme le Web (école d'ingénieur) · Chapitre 5 · Exercice de TD
Cacher sans casser
Le modèle de boîte · niveau 1 (application)
Énoncé
Pour chaque situation, choisir, en justifiant, l'un de ces trois moyens : display: none, visibility: hidden ou l'attribut hidden.
- Un message « Panier vide » à faire apparaître plus tard par JavaScript.
- Une icône de chargement qui ne doit pas faire sauter la mise en page quand elle disparaît.
- Le menu complet, sur téléphone, tant que le bouton « Menu » n'est pas pressé.
Corrigé
- L'attribut
hidden: le contenu n'existe pas encore pour l'utilisateur, et le script n'aura qu'à retirer l'attribut. Il équivaut àdisplay: none. visibility: hidden: l'icône garde sa place, et rien ne bouge quand elle apparaît ou disparaît.display: nonedans la feuille de style pour les petits écrans (chapitre 9) : c'est une décision de présentation, qui dépend de la largeur de la fenêtre, pas du contenu.
100 % gratuit
La suite du chapitre est sur Adloun
- 10 autres exercices corrigés dans ce chapitre
- Les 2 QCM du chapitre, le premier sans compte
- Le tuteur, qui guide pas à pas sans donner la réponse
Sans compte : le cours et le premier QCM. Exercices et tuteur : inscription gratuite en 30 secondes, sans carte bancaire.