Aiuto con la pagina styling

StackOverflow https://stackoverflow.com/questions/1842853

  •  12-09-2019
  •  | 
  •  

Domanda

Ho questa immagine di essere immessi nella parte superiore di una pagina. 

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

Il problema è che c'è un po 'di imbottitura che sta apparendo a sinistra, in alto, a destra, e inferiore dell'immagine. Non voglio che ci imbottitura. In altre parole, voglio che la parte superiore dell'immagine sia a filo con la sinistra e in alto della pagina, e per di allungare tutta la larghezza della pagina. Come posso raggiungere questo obiettivo con uno stile?

È stato utile?

Soluzione

stili predefiniti Alcuni browser danno l'elemento del corpo un'imbottitura, e alcuni danno un margine. Avrai bisogno di rimuovere sia in modo che l'immagine sia a livello contro la finestra in tutti i browser. 

    body { margin: 0; border: 0 }

Altri suggerimenti

È necessario utilizzare le regole di reset CSS per ripristinare gli stili del browser, poi costruire da lì. Io uso http://meyerweb.com/eric/thoughts/2007 / 05/01 / reset-ricaricati / 

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

Tuttavia se un'immagine che è essenzialmente un decoratin di somesort (es. "Contenuto" non legato o ad un'altra pagina) Io preferisco usare come immagine di sfondo nella elemento genitore.

Ad esempio

    # Pseudo-image {height: 100px; larghezza: 200px; sfondo: url trasparente (path / to / immagine) scorrere no-repeat in alto a sinistra;}      

Naturalmente facendo in questo modo si sono limitati a visualizzare l'immagine nelle sue dimensioni reali e si deve impostare il div a quelle stesse dimensioni o più grandi.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top