CSS margin egenskab
- foregående side list-style-type
- Næste side margin-block
Definisjon og bruk
margin kortformegenskapen setter alle kantmarginalene i en deklarasjon. Egenskapen kan ha 1 til 4 verdier.
Beskrivelse
Denne kortformegenskapen setter bredden på alle kantmarginalene til et element, eller setter bredden på kantmarginalene på hver side.
Vertikale kantmarginaler for blokkinndhold vil slå sammen, mens inline-elementer faktisk ikke tar opp vertikale kantmarginaler. Lateral kantmarginaler for inline-elementer slås ikke sammen. På samme måte vil kantmarginaler for flytende elementer ikke slå sammen. Negativ kantmarginalverdi kan spesifiseres, men bruk den med forsiktighet.
Kommentarer:Negativ verdier kan brukes.
Eksempel 1
margin:10px 5px 15px 20px;
- Øvre kantmarginal er 10px
- Høyre kantmarginal er 5px
- Nedre kantmarginal er 15px
- Venstre kantmarginal er 20px
Eksempel 2
margin:10px 5px 15px;
- Øvre kantmarginal er 10px
- Høyre kantmarginal og venstre kantmarginal er 5px
- Nedre kantmarginal er 15px
Eksempel 3
margin:10px 5px;
- Øvre kantmarginal og nedre kantmarginal er 10px
- Høyre kantmarginal og venstre kantmarginal er 5px
Eksempel 4
margin:10px;
- Alle 4 kantmarginalene er 10px
Se også:
CSS undervisning:CSS margin
HTML DOM referansehåndbok:margin egenskap
CSS syntaks
margin: length|auto|initial|inherit;
Egenskapsverdi
Verdi | Beskrivelse |
---|---|
auto | Nettleseren beregner kantmarginalene. |
length | Definerer kantmarginalverdien i en spesifikk enhet, for eksempel pixel, centimeter osv. Standardverdien er 0px. |
% | Angir kantmarginalene som en prosentandel av innholdselementets bredde. |
inherit | Definerer at kantmarginalene skal arves fra foreldreelementet. |
Teknisk detalj
Standardverdi: | 0 |
---|---|
Arv: | nei |
Versjon: | CSS1 |
JavaScript syntaks: | object.style.margin="10px 5px" |
Flere eksempler
- Alle kantmarginalene i en deklarasjon
- Dette eksempelet viser hvordan man setter alle kantmarginalene i en deklarasjon.
Nettleserstøtte
Tallene i tabellen angiver den første nettleseren som fullt ut støtter egenskapen.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1.0 | 6.0 | 1.0 | 1.0 | 3.5 |
- foregående side list-style-type
- Næste side margin-block