Maison >interface Web >tutoriel CSS >Pourquoi y a-t-il un espace blanc en haut de ma page Web, même si j'ai vérifié les marges et le remplissage ?
Espace blanc en haut de la page : découvrir le mystère
Vous avez rencontré un espace blanc inattendu en haut de votre page Web, malgré l'inspection de chaque élément et la découverte d'aucune marge ou rembourrage apparent. En inspectant l'élément HTML, vous avez remarqué l'espace, alors que l'élément body ne l'incluait pas. La suppression de la déclaration DOCTYPE a résolu le problème.
Pour résoudre ce problème, envisagez d'implémenter une réinitialisation CSS dans la feuille de style de votre site Web. Différents navigateurs peuvent afficher des marges et un remplissage par défaut dont vous n'avez pas connaissance. Une réinitialisation CSS initialise une table rase en standardisant le style des éléments dans tous les navigateurs.
Code de réinitialisation CSS :
* { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
Cette réinitialisation complète éliminera tout espace blanc indésirable à en haut ou ailleurs sur votre page. N'oubliez pas de placer ce code de réinitialisation au début de votre feuille de style.
Mise à jour : Sélecteur universel pour la compatibilité entre navigateurs :
Suggestion de Frank d'utiliser le Sélecteur universel ( *) au lieu de lister explicitement tous les éléments est également remarquable. Ce sélecteur s'est avéré compatible avec tous les principaux navigateurs :
* { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
Mettez en œuvre l'une ou l'autre méthode pour résoudre efficacement le problème des espaces blancs et garantir une mise en page cohérente dans les différents navigateurs.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!