Maison  >  Article  >  interface Web  >  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
Barbara Streisandoriginal
2024-11-13 12:05:02633parcourir

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 ligne de base, é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;
}

Mise à jour : sélecteur universel

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

* {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        font-size: 100%;
        vertical-align: baseline;
        background: transparent;
    }

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!

Déclaration:
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