Margin vs Padding
Forskjellen mellom margin og polstring er et viktig aspekt i CSS, da margin og polstring er to viktige konsepter som brukes i CSS for å gi avstand mellom forskjellige elementer. Polstring og marger er ikke utskiftbare og har forskjellige formål, så de må brukes riktig. Polstringen er mellomrommet mellom innholdet og kanten av en blokk. Marginen er derimot plassen utenfor grensen til en blokk. Margin skiller blokker fra tilstøtende blokker mens polstringen skiller grensen fra innholdet.
Hva er polstring?
I CSS (Cascading Style Sheets) er polstring mellomrommet mellom innholdet og kanten. Den skiller innholdet i en blokk fra kanten. Polstringen er gjennomsiktig og inkluderer også bakgrunnsbildet eller bakgrunnsfargen til elementet. Mengden utfylling av et element spesifiseres ved å bruke begrepet "polstring" i CSS-koden. For eksempel, for å legge til en 25px-utfylling rundt innholdet kan følgende kode brukes.
div {
bredde: 300px;
høyde: 300px;
polstring: 25px;
kant: 25px solid;
}
Om nødvendig kan forskjellige utfyllingsverdier spesifiseres separat for venstre, høyre, topp og bunn også. Følgende kodestykke spesifiserer forskjellige utfyllingsverdier for hver side.
div {
bredde: 300px;
høyde: 300px;
padding-top: 25px;
padding-bottom: 35px;
padding-venstre: 5px;
padding-right: 10px;
kant: 25px solid;
}
Hva er margin?
I CSS (Cascading Style Sheets) er margen plassen utenfor grensen. Den skiller en blokk fra andre blokker. Marginen er også gjennomsiktig, men en stor forskjell med polstring er at margen ikke inkluderer bakgrunnsbilder eller bakgrunnsfarger brukt på elementet. Mengden margin i CSS er spesifisert ved å bruke begrepet "margin". Følgende kodebit brukte en margin på 25 px rundt div-blokken.
div {
bredde: 320px;
høyde: 320px;
kant: 5px solid;
margin: 25px;
}
Ulike verdier kan også spesifiseres for forskjellige sider av blokken. Følgende kodestykke bruker forskjellige marginverdier for hver side.
div {
bredde: 320px;
høyde: 320px;
kant: 5px solid;
margin-top: 25px;
margin-bottom: 35px;
margin-left: 5px;
margin-right: 10px;
}
Hva er forskjellen mellom Margin og Padding?
• Utfylling er mellomrommet mellom rammen og innholdet, mens margen er mellomrommet utenfor rammen.
• Utfylling skiller innholdet i en blokk fra kanten. Marginen skiller den ene blokken fra den andre.
• Padding består av bakgrunnsbildene og bakgrunnsfargene som brukes på innhold mens margen ikke inneholder slikt.
• Marginene til tilstøtende blokker kan overlappe mens polstringen ikke overlapper.
Sammendrag:
Padding vs Margin
Padding er rommet innenfor rammen til en blokk som skiller kanten fra innholdet. Margen er avstanden utenfor grensen som skiller en blokk fra de tilstøtende blokkene. En annen forskjell er at utfylling inkluderer bakgrunnsbildet og bakgrunnsfarger påført rundt innholdet mens margen ikke inneholder dem. Marginene til tilstøtende blokker kan noen ganger overlappe når nettleseren gjengir siden, men for utfylling vil slikt ikke skje.