Verschil tussen marge en opvulling

Marge versus opvulling
 

Het verschil tussen marge en opvulling is een belangrijk aspect in CSS aangezien marge en opvulling twee belangrijke concepten zijn die in CSS worden gebruikt om ruimte tussen verschillende items te bieden. Opvulling en marges zijn niet uitwisselbaar en hebben verschillende doelen, dus moeten op de juiste manier worden gebruikt. De opvulling is de ruimte tussen de inhoud en de rand van een blok. De marge, aan de andere kant, is de ruimte buiten de rand van een blok. Marge scheidt blokken van aangrenzende blokken terwijl de opvulling de rand van de inhoud scheidt.

Wat is vulling?

In CSS (Cascading Style Sheets), opvulling is de ruimte tussen de inhoud en de rand. Het scheidt de inhoud van een blok van zijn rand. De opvulling is transparant en bevat ook de achtergrondafbeelding of achtergrondkleur van het element. De hoeveelheid opvulling van een element wordt gespecificeerd met behulp van de term 'opvulling' in CSS-code. Voor het toevoegen van een opvulling van 25px rond de inhoud kan de volgende code worden gebruikt.

div
breedte: 300 px;
hoogte: 300 px;
opvulling: 25px;
rand: 25px massief;

Indien nodig kunnen ook verschillende opvulwaarden afzonderlijk worden gespecificeerd voor links, rechts, boven en onder. Het volgende stuk code geeft verschillende opvullingswaarden op voor elke zijde.

div
breedte: 300 px;
hoogte: 300 px;
padding-top: 25px;
padding-bottom: 35px;
padding-links: 5px;
opvulling rechts: 10px;
rand: 25px massief;

Wat is Margin?

In CSS (Cascading Style Sheets) is marge de spatie buiten de rand. Het scheidt een blok van andere blokken. De marge is ook transparant, maar een groot verschil met opvulling is dat de marge geen achtergrondafbeeldingen of achtergrondkleuren bevat die op het element zijn toegepast. De hoeveelheid marge in CSS wordt gespecificeerd met de term "marge". Het volgende stuk code paste een marge van 25 px toe rond het div-blok.

div
breedte: 320 px;
hoogte: 320 px;
rand: 5px vast;
marge: 25px;

Verschillende waarden kunnen ook voor verschillende kanten van het blok worden gespecificeerd. Het volgende stuk code past verschillende margewaarden toe voor elke zijde.

div
breedte: 320 px;
hoogte: 320 px;
rand: 5px vast;
margin-top: 25px;
margin-bottom: 35px;
marge links: 5px;
margin-right: 10px;

Wat is het verschil tussen marge en opvulling?

• Opvulling is de ruimte tussen de rand en de inhoud, terwijl marge de spatie buiten de rand is.

• Opvulling scheidt de inhoud van een blok van de rand. De marge scheidt het ene blok van het andere.

• Opvulling bestaat uit de achtergrondafbeeldingen en achtergrondkleuren die op de inhoud worden toegepast, terwijl de marge dat niet bevat.

• Marges van aangrenzende blokken kunnen elkaar overlappen, terwijl de opvulling niet overlapt.

Samenvatting:

Vulling versus marge

Opvulling is de ruimte binnen de rand van een blok dat de grens van de inhoud scheidt. De marge is de afstand buiten de grens die een blok scheidt van de aangrenzende blokken. Een ander verschil is dat padding de achtergrondafbeelding en achtergrondkleuren omvat die rondom de inhoud worden toegepast, terwijl de marge deze niet bevat. De marges van aangrenzende blokken overlappen elkaar soms wanneer de browser de pagina weergeeft, maar voor opvulling gebeurt dit niet.

Afbeeldingen beleefdheid:

1. CSS-doosmodel door Felix.leg (CC BY-SA 3.0)