Марж срещу подложка
Разликата между margin и padding е важен аспект в CSS, тъй като margin и padding са две важни концепции, използвани в CSS за осигуряване на разстояние между различни елементи. Подложките и полетата не са взаимозаменяеми и имат различни цели, така че трябва да се използват по подходящ начин. Подложката е пространството между съдържанието и границата на блок. Маржът, от друга страна, е пространството извън границата на блок. Полето разделя блоковете от съседните блокове, докато подложката разделя границата от съдържанието.
Какво е Padding?
В CSS (Cascading Style Sheets) подложката е пространството между съдържанието и границата. Той разделя съдържанието на блок от неговия ръб. Подложката е прозрачна и включва също фоновото изображение или цвета на фона на елемента. Размерът на подложката на елемент се определя чрез използване на термина „подложка“в CSS кода. Например, за да добавите 25px подложка около съдържанието, може да се използва следният код.
div {
ширина: 300px;
височина: 300px;
padding: 25px;
контур: 25px плътен;
}
Ако е необходимо, различни стойности на подплънките могат да бъдат зададени поотделно и за ляво, дясно, горе и долу. Следната част от кода определя различни стойности за подпълване за всяка страна.
div {
ширина: 300px;
височина: 300px;
padding-top: 25px;
padding-bottom: 35px;
padding-left: 5px;
padding-right: 10px;
контур: 25px плътен;
}
Какво е Маржин?
В CSS (Cascading Style Sheets) полето е пространството извън границата. Той разделя един блок от други блокове. Полето също е прозрачно, но голяма разлика с подложката е, че полето не включва фонови изображения или фонови цветове, приложени към елемента. Размерът на маржа в CSS се определя с помощта на термина „марж“. Следната част от кода приложи поле от 25px около блока div.
div {
ширина: 320px;
височина: 320px;
граница: плътни 5px;
поле: 25px;
}
Могат да се задават и различни стойности за различните страни на блока. Следната част от кода прилага различни стойности на полета за всяка страна.
div {
ширина: 320px;
височина: 320px;
граница: плътни 5px;
margin-top: 25px;
margin-bottom: 35px;
margin-left: 5px;
margin-right: 10px;
}
Каква е разликата между Margin и Padding?
• Подложката е пространството между границата и съдържанието, докато полето е пространството извън границата.
• Подложката разделя съдържанието на блок от границата. Полето разделя единия блок от другия.
• Подложката се състои от фонови изображения и фонови цветове, приложени към съдържанието, докато полето не съдържа такова съдържание.
• Полетата на съседни блокове могат да се припокриват, докато подложките не се припокриват.
Резюме:
Подпълване срещу поле
Padding е пространството вътре в границата на блок, което разделя границата от съдържанието. Полето е разстоянието извън границата, което разделя блок от съседните блокове. Друга разлика е, че подложката включва фоновото изображение и фоновите цветове, приложени около съдържанието, докато полето не ги съдържа. Полетата на съседни блокове може понякога да се припокриват, когато браузърът изобразява страницата, но за подпълване такова нещо няма да се случи.
