Style właściwość boxSizing

Definicja i użycie

boxSizing Atrybut pozwala określić w sposób specyficzny, jak określony element pasuje do określonej strefy.

Na przykład, jeśli chcesz umieścić obok siebie dwa ramki z bokami, można ustawić box-sizing na "border-box". To pozwala przeglądarki na wyświetlenie ramki z określoną szerokością i wysokością, umieszczając ramki i wewnętrzne marginesy w ramce.

Inne zasoby:

CSS Księga Prawbox-sizing właściwość

Przykład

Zmiana właściwości boxSizing:

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

Spróbuj sam

Gramatyka

Zwróć właściwość boxSizing:

obiekt.style.boxSizing

Ustawienie właściwości boxSizing:

obiekt.style.boxSizing = "content-box|border-box|initial|inherit"

Wartość atrybutu

Wartość Opis
content-box

Domyślna wartość. To jest zachowanie szerokości i wysokości określone przez CSS2.1.

Zdefiniowana szerokość i wysokość (oraz atrybuty min/max) są stosowane do szerokości i wysokości ramki zawartości elementu.

Wewnętrzne marginesy i ramki elementu są układane i rysowane poza zdefiniowaną szerokością i wysokością.
border-box

Szerokość i wysokość elementu określają jego ramkę.

To znaczy, że jakiekolwiek wewnętrzne marginesy i ramki określone dla elementu będą rysowane wewnątrz zdefiniowanej szerokości i wysokości.

Długość i szerokość treści można uzyskać, odjąc marginesy i ramki od zdefiniowanej szerokości i wysokości.
initial Ustawia tę właściwość na jej wartość domyślną. Zobacz: initial。
inherit Dziedziczy tę właściwość od elementu nadrzędnego. Zobacz: inherit。

Szczegółowe informacje techniczne

Domyślna wartość: content-box
Wartość zwracana: łańcuch, który reprezentuje box-sizing właściwość。
Wersja CSS: CSS3

Obsługa przeglądarek

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Wspierane Wspierane Wspierane Wspierane Wspierane