国产色在线视频-国产色综合一区二区三区-国产身材极品喷水 在线播放-国产深夜福利视频观看-国产深夜福利视频在线-国产深夜福利视频在线播放

瀏覽器兼容問題與解決方法

2017/2/22 13:46:58   閱讀:1962    發(fā)布者:1962

瀏覽器兼容問題是指,不同廠商開發(fā)的瀏覽器針對同一段代碼的不同解析,
造成頁面展示效果出現(xiàn)差異的情況,很多時(shí)候?yàn)榱俗非箫@示效果的一直,
前端開發(fā)人員就要針對不同兼容問題應(yīng)用相應(yīng)的方法處理,
達(dá)到效果一致的目的。

下面這些是平時(shí)開發(fā)過程中遇到的,做個匯總,方便查閱。

1、<!DOCTYPE HTML>文檔類型的聲明

產(chǎn)生條件:IE6瀏覽器,當(dāng)我們沒有書寫這個文檔聲明的時(shí)候,
會觸發(fā)IE6瀏覽器的怪異解析現(xiàn)象;
解決辦法:書寫文檔聲明。
2、橫向雙外邊距
產(chǎn)生條件:在IE6中塊元素浮動后(左浮左margin,右浮右margin),
會出現(xiàn)橫向雙倍margin現(xiàn)象。
解決辦法:在float標(biāo)簽的樣式控制中加入display:inline,
或者左幅右margin,右浮左margin。
3、默認(rèn)行高
產(chǎn)生條件:IE6\IE7遨游瀏覽器;設(shè)置的文字高度超出盒模型內(nèi)容
區(qū)域設(shè)置的高度時(shí)會影響布局。
解決辦法:給超出高度的標(biāo)簽設(shè)置overflow:hidden;
或?qū)⑽淖值男懈遧ine-height設(shè)置為小于塊的高度
4、不同瀏覽器當(dāng)中,很多的標(biāo)簽的默認(rèn)樣式不同,如默認(rèn)的外補(bǔ)丁內(nèi)補(bǔ)丁。
產(chǎn)生條件:不同瀏覽器
解決方法:利用CSS reset文件進(jìn)行樣式的清除,然后在根據(jù)需要進(jìn)行設(shè)置。
5、img外部的border
產(chǎn)生條件:img外部有a標(biāo)簽,即img標(biāo)簽有鏈接時(shí)
解決辦法:設(shè)置img邊框border:0;
6、經(jīng)典3像素bug
產(chǎn)生條件:IE6瀏覽器,浮動塊元素與未浮動塊元素處于同一行,有默認(rèn)的3px間距。
解決辦法:設(shè)置非浮動元素浮動。
7、png格式圖片
產(chǎn)生條件:IE6瀏覽器,不支持透明;
解決辦法:使用JavaScript進(jìn)行處理;或者使用GIF、JPG圖像替代掉png圖片的使用。
8、默認(rèn)行高
產(chǎn)生條件:清浮動的時(shí)候,有些人會采取一種清浮動的方法,使用一個空的div,
然后為這個div設(shè)置{clear:both}。在大部分瀏覽器當(dāng)中,這樣做是沒有任何問題的,
但是在IE6瀏覽器當(dāng)中,div即使是空的,也會存在默認(rèn)行高。
解決方法:設(shè)置其高度為0,并設(shè)置overflow:hidden。{height:0;
overflow:hidden;clear:both;}