根據由全球資訊網聯盟（w3c）於2023年發行並於2023年修訂的css1所指定的，當任意乙個塊級元素的寬度或高度被顯式指定，它應當只確定這個可見元素自身(內容區)的寬度或高度，而padding, border和margin隨後被應用。internet explorer在「怪異模式」 則把內容，內邊距（padding）和邊框（border）全部包括在乙個指定的寬度或高度之內；這導致它呈現出乙個比遵從標準行為的結果更窄或者更短的盒子，具體分析如下：
元素的總寬度和高度是：邊框寬度+元素內邊距+元素內容的寬度。即顯示在我們介面上的所佔的寬度。但是在css中設定的「width」是他的內容的寬度，而不是總寬度。因此總寬度=width+2*padding+2*border；
w3c的標準盒模型
ie傳統模式盒子模型
jQuery的盒子模型（尺寸）方法
獲取或者設定元素的寬度，不包括內邊距，邊框，以及外邊距 innerwidth 獲取或者設定元素加上內邊距的寬度 outerwidth 獲取或者設定元素本身加上內邊距再加上邊框的寬度 outerwidth true 獲取或者設定元素本身加上內邊距 邊框以及外邊距的寬度 height 獲取或者設定元素的...
盒子邊框 外邊距 內邊距 盒子模型的尺寸
1.盒子模型由 網頁內容content 邊框boder 內邊距padding 外邊距margin 四部分組成 2.邊框boder 三個屬性 顏色color 粗細width 樣式style 01.color 分開設定boder top color上邊框顏色 boder bottom color下邊框顏...
盒子模型與怪異盒子模型
所有html元素可以看作盒子，在css中，box model 這一術語是用來設計和布局時使用。css盒模型本質上是乙個盒子，封裝周圍的html元素，它包括 邊距，邊框，填充，和實際內容。盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素。下面的說明了盒子模型 box model content...