Разлика между марж и подплънки

Маржин срещу Padding
 

Разликата между марж и подплънки е важен аспект в CSS като марж и подплънки са две важни концепции, използвани в CSS за осигуряване на разстояние между различните елементи. Подплънките и полетата не са взаимозаменяеми и имат различни цели, така че трябва да се използват по подходящ начин. Подплънката е пространството между съдържанието и границата на блок. Маржът, от друга страна, е пространството извън границата на блок. Марджът отделя блокове от съседни блокове, докато подложката разделя границата от съдържанието.

Какво е Padding?

В CSS (Каскадни стилове), тампонът е пространството между съдържанието и границата. Той отделя съдържанието на блок от ръба му. Подплънката е прозрачна и включва фоновото изображение или цвета на фона на елемента. Количеството на подплънките на даден елемент се определя, като се използва терминът "padding" в CSS код. Например за добавяне на 25px подложка около съдържанието може да се използва следния код.

div
ширина: 300px;
височина: 300px;
подплънки: 25px;
граница: 25px твърдо вещество;

Ако е необходимо, различни стойности на подплънките могат да бъдат определени поотделно и за ляво, дясно, отгоре и отдолу. Следващата част от кода определя различни стойности на подплънките за всяка страна.

div
ширина: 300px;
височина: 300px;
подложка: 25px;
подложка-дъно: 35px;
подложка-ляво: 5px;
подложка-дясно: 10px;
граница: 25px твърдо вещество;

Какво е марж?

В CSS (Cascading Style Sheets) маржът е пространството извън границата. Той отделя блок от други блокове. Маржът също е прозрачен, но голяма разлика с подплънките е, че полето не включва фонови изображения или цветове на фона, приложени към елемента. Размерът на маржа в CSS се определя с помощта на термина „марж“. Следващото парче код приложи 25px марж около div блока.

div
ширина: 320px;
височина: 320px;
граница: 5px твърда;
марж: 25px;

Могат да бъдат зададени и различни стойности за различни страни на блока. Следният код прилага различни стойности на марж за всяка страна.

div
ширина: 320px;
височина: 320px;
граница: 5px твърда;
марж-отгоре: 25px;
марж-дъно: 35px;
марж-ляво: 5px;
марж-десен: 10px;

Каква е разликата между Margin и Padding?

• Padding е пространството между границата и съдържанието, докато маржът е пространството извън границата.

• Padding разделя съдържанието на блок от границата. Маржът отделя един блок от другия.

• Padding се състои от фонови изображения и цветове на фона, приложени към съдържанието, докато полето не съдържа такова.

• Полетата на съседни блокове могат да се припокриват, докато подложките не се припокриват.

Резюме:

Padding срещу Margin

Padding е пространството вътре в границата на блок, което отделя границата от съдържанието. Маржът е разстоянието извън границата, което отделя блок от съседните блокове. Друга разлика е, че подплънката включва фоновото изображение и цветовете на фона, приложени около съдържанието, докато полето не ги съдържа. Полетата на съседни блокове понякога може да се припокриват, когато браузърът направи страницата, но за подплащане такова нещо няма да се случи.

С любезност на изображенията:

1. CSS модел на кутията на Felix.leg (CC BY-SA 3.0)