天天看點

Style boxSizing 屬性

Style 對象

執行個體

改變 boxSizing 屬性:

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

定義和用法

boxSizing 屬性允許您以特定的方式定義比對某個區域的特定元素。

例如,如果您需要并排放置兩個帶邊框的框,可通過将 boxSizing 設定為 "border-box" 來實作。這可令浏覽器呈現出帶有指定寬度和高度的框,并把邊框和内邊距放入框中。

浏覽器支援

Style boxSizing 屬性
Style boxSizing 屬性
Style boxSizing 屬性
Style boxSizing 屬性
Style boxSizing 屬性

Internet Explorer、Opera、Chrome 和 Safari 支援 boxSizing 屬性。

Firefox 支援另一個可替代該屬性的屬性,即 MozBoxSizing 屬性。

文法

傳回 boxSizing 屬性:

object.style.boxSizing

設定 boxSizing 屬性:

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

屬性值

描述
content-box 預設值。這是由 CSS2.1 規定的寬度和高度的行為。設定的寬度和高度(及 min/max 屬性)分别應用到元素的内容框的寬度和高度。在設定的寬度和高度之外繪制元素的内邊距和邊框。
border-box 為元素設定的寬度和高度(及 min/max 屬性)決定了元素的邊框盒。也就是說,為元素指定的任何内邊距和邊框都将在已設定的寬度和高度内進行繪制。通過把已設定的 'width' 和 'height' 屬性分别減去邊框和内邊距才能得到内容的寬度和高度。
initial 設定該屬性為它的預設值。請參閱 initial。
inherit 從父元素繼承該屬性。請參閱 inherit。

技術細節

預設值:
傳回值: 字元串,表示元素的 box-sizing 屬性。
CSS 版本 CSS3

相關文章

CSS 參考手冊:box-sizing 屬性

Style 對象