Maison > interface Web > tutoriel CSS > Pourquoi y a-t-il un espace blanc en haut de ma page Web ?

Pourquoi y a-t-il un espace blanc en haut de ma page Web ?

Barbara Streisand
Libérer: 2024-11-13 12:05:02
original
730 Les gens l'ont consulté

Why Is There White Space at the Top of My Web Page?

Problème d'espace blanc HTML en haut de la page

Rencontrer un espace blanc en haut de votre page Web peut être frustrant. Malgré une inspection minutieuse des éléments et aucune cause apparente trouvée, le problème semble provenir de l'élément html.

Pour résoudre ce problème, pensez à ajouter une réinitialisation CSS en haut de la feuille de style de votre site Web. Différents navigateurs affichent les marges et les remplissages par défaut, et les feuilles de style externes peuvent également contribuer à un comportement inattendu. Une réinitialisation CSS définit tous les éléments sur une référence, éliminant ainsi ces incohérences.

Utilisez le code de réinitialisation CSS suivant :

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
Copier après la connexion

Mise à jour : sélecteur universel

Comme suggéré par @Frank, vous pouvez utiliser le sélecteur universel « * » pour simplifier le code de réinitialisation :

* {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        font-size: 100%;
        vertical-align: baseline;
        background: transparent;
    }
Copier après la connexion

Ce sélecteur est compatible avec tous les principaux navigateurs, garantissant une expérience de rendu cohérente sur différentes plates-formes.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal