Margin vs Padding
Forskellen mellem margin og polstring er et vigtigt aspekt i CSS, da margin og polstring er to vigtige begreber, der bruges i CSS for at give afstand mellem forskellige elementer. Polstring og marginer er ikke udskiftelige og har forskellige formål, så de skal bruges korrekt. Polstringen er mellemrummet mellem indholdet og kanten af en blok. Marginen er på den anden side rummet uden for grænsen af en blok. Margen adskiller blokke fra tilstødende blokke, mens polstringen adskiller grænsen fra indholdet.
Hvad er polstring?
I CSS (Cascading Style Sheets) er polstring mellemrummet mellem indholdet og kanten. Den adskiller indholdet af en blok fra dens kant. Polstringen er gennemsigtig og inkluderer også elementets baggrundsbillede eller baggrundsfarve. Mængden af polstring af et element er specificeret ved at bruge udtrykket "polstring" i CSS-kode. For at tilføje en 25px polstring omkring indholdet kan følgende kode bruges.
div {
bredde: 300px;
højde: 300px;
polstring: 25px;
kant: 25px solid;
}
Hvis det er nødvendigt, kan forskellige polstringsværdier også specificeres separat for venstre, højre, top og bund. Det følgende stykke kode angiver forskellige udfyldningsværdier for hver side.
div {
bredde: 300px;
højde: 300px;
polstring-top: 25px;
polstring-bund: 35px;
polstring-venstre: 5px;
polstring-højre: 10px;
kant: 25px solid;
}
Hvad er margin?
I CSS (Cascading Style Sheets) er margen rummet uden for grænsen. Det adskiller en blok fra andre blokke. Marginen er også gennemsigtig, men en stor forskel med polstring er, at marginen ikke inkluderer baggrundsbilleder eller baggrundsfarver anvendt på elementet. Mængden af margin i CSS er specificeret ved hjælp af udtrykket "margin". Det følgende stykke kode anvendte en margen på 25px omkring div-blokken.
div {
bredde: 320px;
højde: 320px;
kant: 5px solid;
margin: 25px;
}
Forskellige værdier kan også angives for forskellige sider af blokken. Følgende kodestykke anvender forskellige marginværdier for hver side.
div {
bredde: 320px;
højde: 320px;
kant: 5px solid;
margin-top: 25px;
margin-bottom: 35px;
margin-left: 5px;
margin-right: 10px;
}
Hvad er forskellen mellem margin og polstring?
• Padding er mellemrummet mellem rammen og indholdet, mens margen er rummet uden for grænsen.
• Padding adskiller indholdet af en blok fra kanten. Marginen adskiller den ene blok fra den anden.
• Padding består af baggrundsbilleder og baggrundsfarver anvendt på indhold, mens margenen ikke indeholder sådan.
• Marginer på tilstødende blokke kan overlappe, mens polstring ikke overlapper.
Oversigt:
Padding vs Margin
Padding er rummet inden for kanten af en blok, der adskiller kanten fra indholdet. Marginen er afstanden uden for grænsen, der adskiller en blok fra de tilstødende blokke. En anden forskel er, at polstring inkluderer baggrundsbilledet og baggrundsfarver, der er anvendt rundt om indholdet, mens margen ikke indeholder dem. Marginerne på tilstødende blokke kan nogle gange overlappe hinanden, når browseren gengiver siden, men for udfyldning sker sådan noget ikke.
