# Блочная модель

URL: https://chugunov.pro/glossary/frontend/blochnaia-model/
Оригинальное название: box model
Раздел: [Frontend](https://chugunov.pro/glossary/frontend/)
Обновлено: 28.07.2026.
Источник: глоссарий веб-разработки chugunov.pro.

## Коротко

Модель расчёта размеров элемента из содержимого, внутренних отступов, границ и внешних отступов.

## Что такое «Блочная модель»

Модель расчёта размеров элемента из содержимого, внутренних отступов, границ и внешних отступов. По ней итоговый размер складывается из этих частей, что влияет на компоновку. Свойство `box-sizing: border-box` включает отступы и границу в заданную ширину, упрощая вёрстку. Понимание блочной модели — фундамент CSS: без него трудно предсказать реальные размеры элементов.

## Связанные термины

- [Бокс внешнего отступа](https://chugunov.pro/glossary/frontend/boks-vneshnego-otstupa/) — Внешняя область блочной модели, включающая размер элемента вместе с его margin.
- [Ограничивающий прямоугольник](https://chugunov.pro/glossary/frontend/ogranichivaiushchii-priamougol-nik/) — Минимальная прямоугольная область, полностью охватывающая визуальное представление элемента.
- [Строковый бокс](https://chugunov.pro/glossary/frontend/strokovyi-boks/) — Прямоугольная область, которую браузер формирует для содержимого одной строки в контексте строчного форматирования.
- [Тень блока](https://chugunov.pro/glossary/frontend/ten-bloka/) — CSS-эффект, добавляющий одну или несколько внешних либо внутренних теней к прямоугольнику элемента.
- [Граница элемента](https://chugunov.pro/glossary/frontend/granitsa-elementa/) — Линия вокруг области содержимого и внутренних отступов элемента, для которой задаются толщина, стиль и цвет.
- [Внутренний отступ](https://chugunov.pro/glossary/frontend/vnutrennii-otstup/) — Пространство между содержимым элемента и его границей.
- [Стандартный режим](https://chugunov.pro/glossary/frontend/standartnyi-rezhim/) — Режим отображения, в котором браузер следует современным спецификациям HTML и CSS.
- [Свойство display](https://chugunov.pro/glossary/frontend/svoistvo-display/) — CSS-свойство, определяющее тип внешнего и внутреннего расположения элемента, например block, inline, flex или grid.