瀏覽器css bug及bug解決方法

2022-06-22    分類: 網(wǎng)站建設(shè)

Bugs及解決方案列表(以下實(shí)例默認(rèn)運(yùn)行環(huán)境都為Standard mode):
如何在IE6及更早瀏覽器中定義小高度的容器?
方法:
#test{overflow:hidden;height:1px;font-size:0;line-height:0;}
IE6及更早瀏覽器之所以無法直接定義較小高度的容器是因?yàn)槟J(rèn)會(huì)有行高
如何解決IE6及更早瀏覽器浮動(dòng)時(shí)產(chǎn)生雙倍邊距的BUG?
方法:
#test{display:inline;}
當(dāng)在IE6及更早瀏覽器中出現(xiàn)浮動(dòng)后margin值解析為雙倍的情況,設(shè)置該元素的display屬性為inline即可。
如何在IE6及更早瀏覽器下模擬min-height效果?
方法:
#test{min-height:100px;_height:100px;}
注意此時(shí)#test不能再設(shè)置overflow的值為hidden,否則模擬min-height效果將失效
如何解決按鈕在IE7及更早瀏覽器下隨著value增多兩邊留白也隨著增加的問題?
方法:
input,button{overflow:visible;}
如何解決IE7及更早瀏覽器下當(dāng)li中出現(xiàn)2個(gè)或以上的浮動(dòng)時(shí),li之間產(chǎn)生的空白間隙的BUG?
方法:
li{vertical-align:top;}
除了top值,還可以設(shè)置為text-top | middle | bottom | text-bottom,甚至特定的和值都可以
如何解決IE6及更早瀏覽器下的3像素BUG?
方法:
.a{color:#f00;} .main{width:950px;background:#eee;} .content{float:left;width:750px;height:100px;background:#ccc;_margin-right:-3px;} .aside{height:100px;background:#aaa;}
content
aside
在IE6及更早瀏覽器下為.content設(shè)置margin-right:-3px;也可以設(shè)置.aside為浮動(dòng)
如何解決IE6下的文本溢出BUG(江湖匪號(hào):“諜影重重”或“一只豬的故事”)?
BUG重現(xiàn):
.test{zoom:1;overflow:hidden;width:500px;} .box1{float:left;width:100px;} .box2{float:right;width:400px;}
↓這就是多出來的那只豬
運(yùn)行如上代碼,你會(huì)發(fā)現(xiàn)文字發(fā)生了溢出,在IE6下會(huì)多出一只“豬”。造成此BUG的原因可能是多重混合的,如浮動(dòng),注釋,寬高定義等等。并且注釋條數(shù)越多,溢出的文本也會(huì)隨之增多。
列舉幾個(gè)解決方法:
刪除box1和box2之間所有的注釋;
不設(shè)置浮動(dòng);
調(diào)整box1或box2的寬度,比如將box的寬度調(diào)整為90px
如何解決IE6使用濾鏡PNG圖片透明后,容器內(nèi)鏈接失效的問題?
方法:
div{width:300px;height:100px;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’*.png’);} a{_position:relative;}
解決方法是為容器內(nèi)的鏈接定義相對(duì)定位屬性position的值為relative
如何解決IE6無法識(shí)別偽對(duì)象:first-letter/:first-line的問題?
方法1:
p:first-letter {float:left;font-size:40px;font-weight:bold;} p:first-line {color:#090;}
增加空格:在偽對(duì)象選擇符:first-letter/:first-line與包含規(guī)則的花括號(hào)”{“間增加空格。
方法2:
p:first-letter {float:left;font-size:40px;font-weight:bold;} p:first-line {color:#090;}

換行:將整個(gè)花括號(hào)”{“規(guī)則區(qū)域換行。細(xì)節(jié)參見E:first-letter和E:first-line選擇符


關(guān)鍵詞:成都品牌網(wǎng)站建設(shè)公司, 網(wǎng)站制作公司, 重慶網(wǎng)站建設(shè), 網(wǎng)站設(shè)計(jì), 網(wǎng)站建設(shè), 手機(jī)網(wǎng)站開發(fā)

當(dāng)前題目:瀏覽器css bug及bug解決方法
URL標(biāo)題:http://www.muchs.cn/news49/170449.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供靜態(tài)網(wǎng)站網(wǎng)站內(nèi)鏈、云服務(wù)器、建站公司、網(wǎng)站收錄網(wǎng)站設(shè)計(jì)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

小程序開發(fā)