Qu'est-ce que 'normalize' en CSS?

normalize.css ou des solutions similaires en termes de fonctionnalités (par exemple, Reset CSS) sont utilisées pour réinitialiser ou normaliser les styles par défaut, qui varient d’un navigateur à l’autre. Cela garantit un rendu plus prévisible et cohérent des éléments sur différentes plateformes.

Principales différences entre normalize.css et Reset CSS :

• Reset CSS : Réinitialise les styles de tous les éléments au minimum (par exemple, supprime marges, bordures et typographie). Utile pour créer un design entièrement personnalisé, mais nécessite d’ajouter manuellement de nombreux styles pour les éléments standards (listes, formulaires, etc.).
• normalize.css : Corrige les divergences dans les styles par défaut tout en conservant des styles standard utiles (par exemple, la typographie pour les titres, les marges pour les listes). Cela réduit la nécessité de les surcharger ultérieurement.

Exemples de normalisation :

• Affichage uniforme de <h1>-<h6> dans différents navigateurs.
• Réinitialisation des margin et padding pour des éléments comme body.
• Correction des différences dans l’affichage des formulaires et des boutons.

/* Exemple de normalize.css pour le body */
body {
  margin: 0; /* Supprime la marge standard */
}

/* Exemple de normalize.css pour h1 */
h1 {
  font-size: 2em; /* Définit la taille standard */
  margin: 0.67em 0; /* Définit les marges standard */
}

En résumé, l’utilisation de normalize.css permet d’éviter les problèmes de compatibilité entre navigateurs dès les premières phases de développement et établit une base plus stable pour le stylisme ultérieur.