Vérifier mobile, desktop et focus

Objectifs de la leçon

• Comprendre Vérifier mobile, desktop et focus dans une vraie boucle CSS.
• Ecrire une règle courte et lisible.
• Verifier rendu, responsive et focus avant de continuer.

Pourquoi cette étape existe

Ajoute un focus visible à l'action et limite la largeur de la carte uniquement à partir de 760 px.

CSS devient fiable quand chaque règle répond à un problème visible : lisibilité, espace, contraste, mise en page ou état interactif.

Méthode de travail

Commence par nommer l'intention, cible le plus petit composant utile, puis ajoute une declaration courte.

Observe ensuite le rendu dans le navigateur et l'onglet Styles des DevTools avant d'ajouter une autre règle.

Piege frequent

Changer des valeurs au hasard peut donner un joli résultat une fois, mais ne prouve ni contraste, ni responsive, ni focus.

Une correction CSS doit rester explicable quand le contenu devient plus long ou quand l'écran change.

Vocabulaire lié

• sélecteur — Partie de la règle qui choisit les éléments styles.
• declaration — Couple propriété/valeur qui produit un effet.
• cascade — Mecanisme qui decide quelle règle s'applique.
• DevTools — Outils du navigateur pour inspecter les styles actifs.

Validation

• Je peux expliquer l'intention de la règle.
• Je vérifie le rendu dans le navigateur.
• Je garde le focus et le responsive visibles.