•  12-09-2019
  •  | 
  •  

Question

Je l'image suivante étant placée en haut d'une page. 

<body>
    <form id="form1" runat="server" >
    <div>
        <div>
            <img src="Images/top.png" width="100%" height="115px" alt="top.png" />
        </div>
    </div>
    </form>
</body>

Le problème est qu'il ya un peu de rembourrage qui apparaît à gauche, en haut, à droite, et en bas de l'image. Je ne veux pas que le rembourrage là. En d'autres termes, je veux que le haut de l'image soit au ras de la gauche et en haut de la page, et à étirer sur toute la largeur de la page. Comment puis-je obtenir cela avec un style?

Était-ce utile?

La solution

Certains navigateurs styles par défaut donnent l'élément du corps un rembourrage, et certains donnent une marge. Vous devrez supprimer à la fois pour que l'image soit à plat contre la fenêtre dans tous les navigateurs. 

    body { margin: 0; border: 0 }

Autres conseils

Vous devez utiliser des règles de réinitialisation CSS pour réinitialiser les styles de navigateur, puis construire à partir de là. J'utilise http://meyerweb.com/eric/thoughts/2007 / 05/01 / reset-reloaded / 

<img style="display: block; padding: 0; margin: 0;" ... />

Toutefois, si son une image qui est essentiellement un decoratin de somesort (ie. Pas « contenu » ou lié à une autre page) je préfère l'utiliser comme une image de fond dans l'élément parent.

Par exemple

    # Pseudo image {height: 100px; largeur: 200px; background: url transparent (path / to / image) défiler no-repeat en haut à gauche;}      

Bien sûr le faire de cette façon, vous êtes limité à l'affichage de l'image à sa taille réelle et vous devez régler la div à ces mêmes dimensions ou plus.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top