JQuery確定css方框模型(盒模型Box Model)

　　做過前臺設(shè)置的都知道css存在兩種盒模型，W3C標(biāo)準(zhǔn)的方框模型和IE瀏覽器的方框模型。除IE以外的大多數(shù)瀏覽器只支持W3C方框模型。IE瀏覽器能夠根據(jù)頁面的呈現(xiàn)模式的定義而是用對性的方框模式。已用哪中呈現(xiàn)的模式取決于頁面上的DOCTYPE的聲明。

　　如果頁面包含有效的DOCTYPE聲明，則以嚴(yán)格模式呈現(xiàn)。

　　如果頁面沒有DOCTYPE聲明或沒有有效的DOCTYPE聲明，則以兼容模式呈現(xiàn)。

　　下面將一個兩種模式的區(qū)別，兩種呈現(xiàn)模式的主要差別是對元素width和height樣式的計算上。如下面的樣式：

　　在W3C的嚴(yán)格模式下，元素的內(nèi)容顯示的范圍是180*72px。內(nèi)邊距和邊框在180*72像素的范圍之外。所以整個元素的覆蓋面積是：width:180 + 10*2 + 5*2 = 210px，height:72 +10*2 + 5*2 =102px。

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

　　是用JQuery判斷Box Modal的方法很簡單。是通過bool類型的$.boxModel標(biāo)志。如果頁面是用的是W3C標(biāo)準(zhǔn)的模型，返回true.否則返回false。

生活不易，碼農(nóng)辛苦
如果您覺得本網(wǎng)站對您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈