date: 2023-09-26
Type: Cours
Projet: Blindcode
Cours: CSS : Le fichier de réinitialisation
Lorsque l'on fait du CSS, un style de base est appliqué à notre page, sans que nous le voyons, en fonction des browser. En plus, vous verrez que plus vous travaillez en css, et sur différent sites, plus vous aurez besoin d'une base, comme le Template Basique html, mais version CSS, je vous invite à le créer en plus du fichier reset. Ainsi vous commencerez tous vos projets en mettant votre reset, votre template et vous commencerez enfin seulement à travailler.
Un fichier "reset.css" ou "normalize.css" est un fichier CSS spécial conçu pour réinitialiser ou normaliser les styles par défaut des navigateurs web. Ces fichiers ont pour but d'éliminer les différences de rendu entre les navigateurs et de créer une base de styles cohérente pour les pages web.
Normalisation des Styles : Les navigateurs ont des styles par défaut différents pour certains éléments HTML tels que les <h1>, <p>, <ul>, etc. Un fichier "reset.css" ou "normalize.css" normalise ces styles de base pour garantir une consistance visuelle sur toutes les plateformes.
Réduction des Incohérences : En éliminant les incohérences de style entre les navigateurs, un fichier "reset.css" ou "normalize.css" permet aux développeurs de travailler avec une base prévisible, ce qui facilite la conception et le développement.
Personnalisation Totale : Une fois que les styles par défaut des navigateurs ont été réinitialisés ou normalisés, les développeurs ont une toile vierge sur laquelle ils peuvent appliquer leurs propres styles personnalisés sans être influencés par les styles par défaut.
Inclure le Fichier CSS : Téléchargez un fichier "reset.css" ou "normalize.css" à partir d'une source fiable, ou utilisez une bibliothèque comme Normalize.css (https://necolas.github.io/normalize.css/) et incluez-le dans votre projet en utilisant une balise <link> dans le <head> de votre document HTML.
Exemple :
<link rel="stylesheet" type="text/css" href="normalize.css">
Placez-le en Premier : Assurez-vous que le fichier "reset.css" ou "normalize.css" est inclus en premier dans votre fichier HTML, avant tous les autres fichiers CSS. Cela garantit que les styles par défaut sont réinitialisés avant d'appliquer vos styles personnalisés.
Exemple :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="normalize.css">
<link rel="stylesheet" type="text/css" href="styles.css">
<!-- Vos autres balises meta et liens de styles -->
</head>
<body>
<!-- Votre contenu HTML -->
</body>
</html>
Personnalisez vos Styles : Après avoir inclus le fichier "reset.css" ou "normalize.css", vous pouvez personnaliser les styles de votre site web en utilisant votre propre fichier CSS.
L'utilisation d'un fichier "reset.css" ou "normalize.css" est une bonne pratique pour garantir la cohérence des styles entre les navigateurs et simplifier le processus de conception web. Cependant, il est important de noter que le choix entre un fichier "reset.css" et "normalize.css" dépendra de vos besoins spécifiques, car ils ont des approches légèrement différentes pour normaliser les styles des navigateurs.
créé le 2023-09-26 à 13:14