玖玖国产精品视频I黄色一级免费电影I亚洲综合激情小说I日韩欧美电影I久久久国产一区I深爱激情综合网

盒模型bug的處理方式

2012/6/27 17:14:18   閱讀:2708    發(fā)布者:2708
content
div.content{
border:20px solid #60A179;; 
padding:30px;
background: #ffc;
width :400px;
voice-family :   "\"}\"";
voice-family :inherit;
width :  300px;
}

同樣,在Opera7.0以前的瀏覽器也有這樣的解析bug。但我們并不需要使用偽值,有更簡單的辦法解決這個問題: html>body .content { width :300; }

boxtest

div.boxtest{ 
border:20px   solid #60A179;
padding: 30px;
background :  #ffc;
width : 400px;
}

標準情況下,這個盒的寬度是:20+30+300+30+20=400px。

但是在IE5.0瀏覽器中,對盒模型的寬度解釋有個bug,它認為300 px是整個盒的總寬度,內(nèi)容的寬度變成:300-20-30-20-30=200px。

為了彌補這個bug,采用一個技巧:即增加一個IE5不能解釋的聲音屬性"voice-family",讀到這個定義時瀏覽器就不再繼續(xù)閱讀,認為寬就是400px,但而其他符合標準的瀏覽器會繼續(xù)閱讀,并執(zhí)行第二個真實值300px。