Стиль свойства boxSizing

Определение и использование

boxSizing Свойство позволяет определить способ определения конкретного элемента в определенной области.

Например, если вам нужно разместить два рамочных контейнера в ряд, можно установить box-sizing в "border-box". Это позволит браузеру отобразить рамочные контейнеры с заданными размерами и включить рамки и отступы в рамки.

См. также:

CSS справочник:box-sizing свойство

Пример

Изменение свойства boxSizing:

document.getElementById("myDIV").style.boxSizing = "border-box";

Попробуйте сами

Грамматика

Возврат свойства boxSizing:

объект.style.boxSizing

Установка свойства boxSizing:

объект.style.boxSizing = "content-box|border-box|initial|inherit"

Значение свойства

Значение Описание
content-box

по умолчанию. Это поведение размеров и высоты, определенное CSS2.1.

Заданные размеры (а также min/max свойства) применяются к ширине и высоте содержимого рамочного контейнера.

Внутренние отступы и рамки элемента выкладываются и рисуются за пределами заданных размеров.
border-box

Ширина и высота элемента определяют рамочный контейнер элемента.

Это означает, что любые внутренние отступы и рамки, указанные для элемента, будут нарисованы в заданных размерах.

Ширина и высота содержимого определяются за счет вычитания из заданных размеров рамки и отступов.
initial Свойство устанавливается в значение по умолчанию. См. initial。
inherit Эта свойство наследуется от родительского элемента. См. inherit。

Технические детали

по умолчанию: content-box
Возвратное значение: строка, представляющая box-sizing свойство。
Версия CSS: CSS3

Поддержка браузеров

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Поддержка Поддержка Поддержка Поддержка Поддержка