Question 01 / 05
Quel sélecteur a la spécificité la plus haute ?
a) .header .nav a
✓ b) #header a
c) header nav a
d) a.active
Un ID (#) vaut 100 points de spécificité — aucune combinaison de classes ou d'éléments ne peut l'égaler sans autre ID. Score : (0,1,0,1).
Question 02 / 05
Avec
box-sizing: border-box, un élément width: 200px et padding: 20px a une largeur totale de :a) 240px
✓ b) 200px
c) 220px
d) 160px
Avec border-box, le width = 200px inclut le padding. La largeur visible est toujours 200px (contenu réel = 160px).
Question 03 / 05
Pour centrer un élément verticalement ET horizontalement avec Flexbox :
a) justify-content: center
b) align-items: center
✓ c) justify-content: center ET align-items: center
d) text-align: center
justify-content centre sur l'axe principal (horizontal par défaut), align-items centre sur l'axe croisé (vertical). Les deux sont nécessaires.
Question 04 / 05
La valeur
1fr en CSS Grid signifie :a) 1 pixel
✓ b) 1 fraction de l'espace disponible
c) 1 pourcentage
d) 1 rem
fr = fraction unit. L'espace restant après colonnes fixes est divisé proportionnellement. Ex : 1fr 2fr → 33% et 66%.
Question 05 / 05
L'approche "Mobile First" utilise :
a) max-width dans les media queries
✓ b) min-width dans les media queries
c) device-width
d) orientation
Mobile First = on code d'abord pour les petits écrans (aucune media query), puis on élargit avec @media (min-width: ...).
5/5
🎉 Toutes les réponses correctes — vous maîtrisez les fondamentaux CSS3 !