Skip to main content

Що таке padding-box?

padding-box не стосується Box Model напряму. Це значення трапляється в інших CSS-властивостях, найчастіше в background-clip, background-origin і border-image. Його сенс: обмежувати область фону або зображення межами padding, не доходячи до границі (border) і не виходячи за неї.

Наприклад:

css
div { background: url(bg.png); background-clip: padding-box; }

У цьому випадку фон буде зафарбований лише до межі padding і не потрапить під border.

Щоб було зрозуміліше:

ЗначенняДо якої межі малюється фон
border-boxдо зовнішньої межі border
padding-boxдо краю padding (border виключається)
content-boxлише всередині content

Важливо: padding-box не є значенням для box-sizing. У box-sizing є лише content-box і border-box.

Підсумок

padding-box, це область, обмежена padding, і використовується у властивостях, які керують малюванням фону або меж.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.