Normalize.css est une alternative au reset CSS. Il offre un haut degré de cohérence entre navigateurs sur le style HTML par défaut. Normalize.css est une alternative moderne et premium pour HTML5 (http://necolas.github.io/normalize.css/）
normalize.css et reset.css sont toutes deux des feuilles de style pour réinitialiser les onglets du navigateur
L’objectif de créer normalize.css est le suivant :
Protégez les styles par défaut utiles du navigateur au lieu de les supprimer complètement
Styles généralisés : Fourni pour la plupart des éléments HTML
Corrigez les propres bugs du navigateur et assurez-vous de la cohérence entre les navigateurs
Optimisez l’utilisabilité du CSS : Utilisez quelques conseils
Expliquez le code : utilisez des commentaires et une documentation détaillée
Normalize.css prend en charge un large éventail de navigateurs, y compris les navigateurs mobiles, et généralise les éléments HTML5, la typographie, les listes, le contenu intégré, les formulaires et les tableaux. Bien que ce projet soit basé sur la généralisation, nous avons utilisé des paramètres par défaut plus pratiques lorsque cela était approprié.
Normalisation vs réinitialisation
1. Normalize.css Protections des défauts de paiement précieux
Le reset force les éléments à avoir le même effet visuel en imposant un style par défaut à presque tous les éléments. En revanche, Normalize.css conserve de nombreux styles de navigateur par défaut. Cela signifie que vous n’avez plus à restyler tous les éléments typographiques courants. Lorsqu’un élément a des valeurs par défaut différentes selon les navigateurs, Normalize.css s’efforce de maintenir ces styles cohérents et aussi cohérents que possible avec les standards modernes.
2. Normalize.css Correction d’un bug dans le navigateur
Il corrige les bugs courants sur les navigateurs de bureau et mobiles. Cela dépasse souvent ce que Reset peut faire. À cet égard, les problèmes Normalize.css corrigés incluent les paramètres d’affichage des éléments HTML5, des problèmes de taille de police avec le texte préformaté, le débordement SVG dans IE9, ainsi que de nombreux bugs liés aux formulaires apparaissant dans divers navigateurs et systèmes d’exploitation.
3. Normalize.css Cela ne rendra pas vos outils de débogage encombrés
L’un des aspects les plus agaçants de l’utilisation de la réinitialisation est la grande chaîne d’héritage dans l’outil de débogage du navigateur, comme montré sur l’image ci-dessous. Il n’y aura pas de problème de ce genre en Normalize.css, car nous sommes très prudents dans l’utilisation des multi-sélecteurs dans nos directives, et nous ne styliserons l’élément cible que de manière intentionnelle.
4. Normalize.css est modulaire
Le projet a été divisé en parties liées mais séparées, ce qui facilite et clarifie les éléments qui sont définis selon des valeurs spécifiques. Cela vous permet de retirer sélectivement des parties que vous n’utiliserez jamais (comme la généralisation des formes).
5. Normalize.css Possède une documentation détaillée
Normalize.css code repose sur des recherches et des tests détaillés et complets sur plusieurs navigateurs. Ce fichier contient des descriptions détaillées du code et des instructions supplémentaires sur le Wiki Github. Cela signifie que vous pouvez découvrir exactement ce que fait chaque ligne de code, pourquoi vous l’avez écrite, les différences entre les navigateurs, et vous pouvez tester la vôtre plus facilement.
Comment utiliser normalize.css
D’abord, installez ou téléchargez Normalize.css depuis Github, puis il y a deux principales façons de l’utiliser.
Stratégie 1 : Utilisez normalize.css comme CSS de base pour vos propres projets, en personnalisant les valeurs de style selon les besoins du designer.
Stratégie 2 : Importez normalize.css code source et construisez dessus, en surpassant les paramètres par défaut avec votre propre CSS quand c’est nécessaire.
Téléchargement de fichier CSS :https://necolas.github.io/normalize.css/8.0.0/normalize.css
|
Publié sur 27/07/2018 14:49:36
|
|
|
|
