Stil boxSizing-egenskap

Definition och användning

boxSizing Egenskapen låter dig definiera specifika element som matchar en viss region på ett specifikt sätt.

Till exempel, om du behöver placera två kantlådor bredvid varandra, kan du ställa in box-sizing till "border-box". Detta gör att webbläsaren visar lådor med specificerad bredd och höjd, och lägger in kantlinjen och inre marginalen i lådan.

Se också:

CSS Referenshandbok:box-sizing egenskap

Exempel

Ändra boxSizing-egenskapen:

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

Prova själv

Syntax

Returnera boxSizing-egenskapen:

object.style.boxSizing

Ställ in boxSizing-egenskapen:

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

Egenskapsvärde

Värde Beskrivning
content-box

Standardvärde. Detta är beteendet för bredd och höjd enligt CSS2.1.

De angivna bredden och höjden (och min/max-attributen) tillämpas på elementets innehållslåda.

Elementets inre marginaler och kantlinjer layoutas och ritas utanför de angivna bredden och höjden.
border-box

Bredd och höjd som anges för elementet bestämmer elementets kantlåda.

Det innebär att alla inre marginaler och kantlinjer som anges för elementet ritas inom den inställda bredden och höjden.

För att få innehållets bredd och höjd måste man subtrahera kantlinjen och inre marginalen från den inställda bredden och höjden.
initial Sätt denna egenskap till dess standardvärde. Se initial。
inherit Följ denna egenskap från dess föräldrelement. Se inherit。

Tekniska detaljer

Standardvärde: content-box
Returvärde: sträng som representerar elementets box-sizing egenskap。
CSS-version: CSS3

Webbläsarstöd

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Stöd Stöd Stöd Stöd Stöd