Margine e riempimento di <Body> Tag

Sto scrivendo un codice HTML molto semplice che è elencato di seguito. Scritto nel blocco note e aperto in IE-8 e Firefox (OS: Windows Vista).Margine e riempimento di <Body> Tag

<html> 
<body> 
    <table border="1"><tr><td>test</td></tr></table> 
</body> 
</html>

Non c'è niente di speciale nel codice precedente, Sta creando spazio dall'angolo in alto a sinistra.

enter image description here

che può essere facilmente rimosso utilizzando il seguente codice

<body style="margin:0; padding:0">

Ora devo trovare il margine predefinito e l'imbottitura, che è 4 per Firefox e diverso per IE-8.

<body style="margin:4; padding:4">

Ho qualche domanda su questo scenario.

Perché questo valore è 4?
Da dove viene questo valore, viene salvato da qualche parte?
Possiamo modificare (configurabile) questo valore predefinito?
Come questi valori sono diversi per i browser?

Grazie.

fonte

2012-06-16 Arun Singh

In almeno Firefox, è sempre 8px per me. Sia da sinistra che dall'alto. – poepje

@poepje, Yea firefox sembra seguire http://www.w3.org/TR/CSS2/sample.html – Pacerier

Prima di tutto, è probabilmente 4px e non 4. In secondo luogo, questo è il modo in cui il fornitore del browser ha deciso di essere il default.
Viene salvato nei fogli di stile del browser predefinito.
È possibile, ma è necessario . Differisce con ciascun browser. Google! How do I change default stylesheet on <insert browser here>?
Probabilmente ci sono lievi differenze, si dovrebbe essere in grado di dire ... guardando i fogli di stile di default :)

Tale differenza è uno dei motivi principali per noi come progettisti utilizzano un reset CSS, a normalizza tutto l'imbarazzo dei CSS che segue le diverse implementazioni del browser.

fonte

2012-06-16 20:38:01

Vale la pena ricordare - cambiare il comportamento di un browser non è la soluzione a qualsiasi cosa – Onkelborg

Una piccola nota su 3 .: Quella sarebbe buono solo se la pagina è destinata solo per uso personale. Se è pubblicato sul Web e altri potrebbero vedere la pagina, avranno il margine di 4/8px e quindi vedranno una pagina leggermente diversa da quella prevista. – poepje

I browser hanno "impostazioni predefinite sane" predefinite per il CSS della maggior parte degli elementi HTML - questo impedisce semplicemente che la pagina appaia completamente illeggibile se si dispone di puro HTML senza CSS, ma sono ovviamente destinati a essere sovrascritti dal proprio CSS .

Gli stili del browser di default sono in genere indicato come un "User Style Agente Foglio" - il seguente sito è un buon riferimento dei vari fogli peculiari UA IE ha avuto nel corso degli anni e fornisce anche quelli per gli altri browser a il fondo:

http://www.iecss.com/

un metodo un sacco di gente usa per "normalizzare" le impostazioni predefinite in modo da avere lo stesso punto di partenza per tutti i browser è un "reset CSS" - questo è solo un snippet di CSS che metti prima del tuo o wn CSS che imposta tutti gli stili UA sulla stessa cosa.Si tratta di un ben noto uno:

http://necolas.github.com/normalize.css/

fonte

2012-06-16 22:38:34 lucideer

Hai fonti per gli stili predefiniti di altri browser principali come Chrome e FireFox? – Pacerier

Vedere la parte inferiore della pagina su http://www.iecss.com/ - tuttavia questa risposta ha 2 anni, non sono sicuro di quanto spesso quel sito Web viene aggiornato. – lucideer

Aggiungere questo sulla parte superiore del foglio di stile

*{margin:0px;padding:0px;}

Questo ha eliminato tutte le differenze di padding e margini fra i browser.

fonte

2015-04-20 20:23:06

Questo è un approccio orribile, poiché la selezione * selezionerà tutto. E di conseguenza, può essere considerato più specifico di altri valori che potresti tentare di impostare altrove. Per non parlare della rimozione delle impostazioni predefinite "sensate" di cui potresti non rendertene conto. – RonLugge

Prova questa

body{ 
    line-height: 0 
}

fonte

2017-10-17 18:43:22

Margine e riempimento di <Body> Tag

risposta

Problemi correlati