Cosa margine: 5px 0; e margine: 5px 0 0; significare?

Question

Vuol dire margin:5px 0;margin:5px 0 0 0; o margin:5px 0 5px 0;?

margin:5px 0 0; significa margin:5px 0 0 0;?

Lo stesso vale per l'imbottitura.

Inoltre, è coerente su tutti i browser (incluso IE6)?

Answer 1

Secondo Box Model:

• Se è presente un solo valore, si applica a tutti i lati.
• Se vi sono due valori, i superiore e peggiori margini sono impostati il primo valore e il destra e rimasti margini sono impostati al secondo.
• Se ci sono tre valori, il superiore è impostato al primo valore, il sinistra e destra sono impostati al secondo, e il fondo è impostato alla terza.
• Se ci sono quattro valori, si applicano alla all'inizio, destra, fondo e sinistra, rispettivamente.

body { margin: 2em }   /* all margins set to 2em */ 
body { margin: 1em 2em }  /* top & bottom = 1em, right & left = 2em */ 
body { margin: 1em 2em 3em } /* top=1em, right=2em, bottom=3em, left=2em */ 

questo è definito dallo standard CSS, quindi dovrebbe essere coerente in tutti i browser che implementa correttamente i CSS. Per le compatibilità del browser, dai un'occhiata a CSS Support History di blooberry e quirksmode. Secondo blooberry, margin è stato implementato per la prima volta in IE3, quindi IE6 dovrebbe andare bene.

Answer 2

Per margin e padding, è possibile specificare uno, due, tre o quattro valori separati da spazi bianchi:

1. un valore: Tutti e quattro i lati utilizzare tale valore.
2. Due valori: superiore/inferiore ottenere il primo valore; sinistra/destra ottenere la seconda
3. tre valori: superiore ottiene il primo, sinistra/destra ottenere la seconda, fondo ottiene il terzo
4. quattro valori: Top, a destra, in basso, a sinistra (vale a direin senso orario da mezzogiorno) ottenere ogni valore

Answer 3

margin: 5px 0; significa margin: 5px 0 5px 0;

margin: 5px 0 0; significa margin: 5px 0 0 0;

Tutti i browser seguono questa, tra cui IE 6.