JQuery確定css方塊模型（盒模型Box Model）

做過前台設定的都知道css存在兩種盒模型，W3C標準的方塊模型和IE瀏覽器的方塊模型。除IE以外的大多數瀏覽器只支援W3C方塊模型。IE瀏覽器能夠根據頁面的呈現模式的定義而是用對性的方框模式。已用哪中呈現的模式取決於頁面上的DOCTYPE的聲明。

如果頁麵包含有效DOCTYPE聲明，則以strict 模式呈現。

如果頁面沒有DOCTYPE聲明或沒有有效DOCTYPE聲明，則以相容模式呈現。

下面將一個兩種模式的區別，兩種呈現模式的主要差別是對元素width和height樣式的計算上。如下面的樣式

{

　　width:180px;

　　height:72px;

　　padding:10px;

　　bording-width:5px;

}

在W3C的strict 模式下，元素的內容顯示的範圍是180*72px。內邊距和邊框在180*72像素的範圍之外。所以整個元素的覆蓋面積是：width:180 + 10*2 + 5*2 = 210px，height:72 +10*2 + 5*2 =102px。

在IE的相容模式下整個元素的覆蓋面積為180*72像素。內容的大小減小到寬度180 - 10*2 - 5*2=150px，高度72 - 10*2 - 5*2 =32px。

是用JQuery判斷Box Modal的方法很簡單。是通過bool類型的$.boxModel標誌。如果頁面是用的是W3C標準的模型，返回true.否則返回false。