日本免费全黄少妇一区二区三区-高清无码一区二区三区四区-欧美中文字幕日韩在线观看-国产福利诱惑在线网站-国产中文字幕一区在线-亚洲欧美精品日韩一区-久久国产精品国产精品国产-国产精久久久久久一区二区三区-欧美亚洲国产精品久久久久

IE6兼容性問題和IE6常見bug詳細(xì)匯總介紹


IE6兼容性問題和IE6常見bug詳細(xì)匯總介紹


1、IE6怪異解析之padding與border算入寬高
原因:未加文檔聲明造成非盒模型解析
解決方法:加入文檔聲明
2、IE6在塊元素、左右浮動、設(shè)定marin時(shí)造成margin雙倍(雙邊距)
解決方法:display:inline
3、以下三種其實(shí)是同一種bug,其實(shí)也不算是個(gè)bug,舉個(gè)例子:父標(biāo)簽高度20,子標(biāo)簽11,垂直居中,20-11=9,9要分給文字的上面與下面,怎么分?IE6就會與其它的不同,所以,盡量避免 。
1)字體大小為奇數(shù)之邊框高度少1px
解決方法:字體大小設(shè)置為偶數(shù)或line-height為偶數(shù)
2)line-height,文本垂直居中差1px
解決方法:padding-top代替line-height居中,或line-height加1或減1
3)與父標(biāo)簽的寬度的奇偶不同的居中造成1px的偏離
解決方法:如果父標(biāo)簽是奇數(shù)寬度,則子標(biāo)簽也用奇數(shù)寬度;如果是父標(biāo)簽偶數(shù)寬度,則子標(biāo)簽也用偶數(shù)寬度
4、內(nèi)部盒模型超出父級時(shí),父級被撐大
解決方法:父標(biāo)簽使用overflow:hidden
5、line-height默認(rèn)行高bug
解決方法:line-height設(shè)值
6、行標(biāo)簽之間會有一小段空白
解決方法:float或結(jié)構(gòu)并排(可讀性差,不建議)
7、標(biāo)簽高度無法小于19px
解決方法:overflow: hidden;
8、左浮元素margin-bottom失效
解決方法:顯示設(shè)置高度 or 父標(biāo)簽設(shè)置_padding-bottom代替子標(biāo)簽的margin-bottom or 再放個(gè)標(biāo)簽讓父標(biāo)簽浮動,子標(biāo)簽
margin- bottom,即(margin-bottom與float不同時(shí)作用于一個(gè)標(biāo)簽)
9、img于塊元素中,底邊多出空白
解決方法:父級設(shè)置overflow: hidden; 或 img { display: block; } 或 _margin: -5px;
10、li之間會有間距
解決方法:float: left;
11、塊元素中有文字及右浮動的行元素,行元素?fù)Q行
解決方法:將行元素置于塊元素內(nèi)的文字前
12、position下的left,bottom錯(cuò)位
解決方法:為父級(relative層)設(shè)置寬高或添加*zoom:1
13、子級中有設(shè)置position,則父級overflow失效
解決方法:為父級設(shè)置position:relative
以下是補(bǔ)充:上面要先看
1、終極方法:條件注釋
這段文字僅顯示在 IE6及IE6以上版本 。
這段文字僅顯示在 IE6以上版本(不包含IE6) 。
缺點(diǎn)是在IE瀏覽器下可能會增加額外的HTTP請求數(shù) 。
2、CSS選擇器區(qū)分
IE6不支持子選擇器;先針對IE6使用常規(guī)申明CSS選擇器,然后再用子選擇器針對IE7 及其他瀏覽器 。
代碼如下:
/* IE6 專用 */
.content {color:red;}
/* 其他瀏覽器 */
div>p .content {color:blue;} -->
3、PNG半透明圖片的問題
雖然可以通過JS等方式解決,但依然存在載入速度等問題,所以,這個(gè)在設(shè)計(jì)上能避免還是盡量避免為好 。以達(dá)到網(wǎng)站最大優(yōu)化 。
4、IE6下的圓角
IE6不支持CSS3的圓角屬性,性價(jià)比最高的解決方法就是用圖片圓角來替代,或者放棄IE6的圓角 。
5、IE6背景閃爍
如果你給鏈接、按鈕用CSS sprites作為背景,你可能會發(fā)現(xiàn)在IE6下會有背景圖閃爍的現(xiàn)象 。造成這個(gè)的原因是由于IE6沒有將背景圖緩存,每次觸發(fā)hover的時(shí)候都會重新加載,可以用JavaScript設(shè)置IE6緩存這些圖片:
代碼如下:
document.execCommand("BackgroundImageCache",false,true);
6、最小高度
IE6 不支持min-height屬性,但它卻認(rèn)為height就是最小高度 。解決方法:使用ie6不支持但其余瀏覽器支持的屬性!important 。
復(fù)制代碼
代碼如下:
【IE6兼容性問題和IE6常見bug詳細(xì)匯總介紹】#container {min-height:200px; height:auto !important; height:200px;}

推薦閱讀