1. Div居中問題
div設(shè)置 margin-left, margin-right 為 auto 時(shí)已經(jīng)居中,IE 不行,IE需要設(shè)定body居中,首先在父級元素定義text-algin: center;這個(gè)的意思就是在父級元素內(nèi)的內(nèi)容居中。
2.鏈接(a標(biāo)簽)的邊框與背景
a鏈接加邊框和背景色,需設(shè)置 display: block, 同時(shí)設(shè)置 float: left 保證不換行。參照 menubar, 給 a 和 menubar 設(shè)置高度是為了避免底邊顯示錯(cuò)位, 若不設(shè) height, 可以在 menubar 中插入一個(gè)空格。
3.超鏈接訪問過后hover樣式就不出現(xiàn)的問題
被點(diǎn)擊訪問過的超鏈接樣式不在具有hover和active了,很多人應(yīng)該都遇到過這個(gè)問題,解決技巧是改變CSS屬性的排列順序: L-V-H-A
Code:
<style type="text/css"> <!-- a:link {} a:visited {} a:hover {} a:active {} --> </style>
4. 游標(biāo)手指cursor
cursor: pointer 可以同時(shí)在 IE FF 中顯示游標(biāo)手指狀, hand 僅 IE 可以
5.UL的padding與margin
ul標(biāo)簽在FF中默認(rèn)是有padding值的,而在IE中只有margin默認(rèn)有值,所以先定義 ul{margin:0;padding:0;}就能解決大部分問題
6. FORM標(biāo)簽
這個(gè)標(biāo)簽在IE中,將會自動margin一些邊距,而在FF中margin則是0,因此,如果想顯示一致,所以最好在css中指定margin和 padding,針對上面兩個(gè)問題,我的css中一般首先都使用這樣的樣式ul,form{margin:0;padding:0;}給定義死了,所以后面就不會為這個(gè)頭疼了.
7. BOX模型解釋不一致問題
在FF和IE中的BOX模型解釋不一致導(dǎo)致相差2px解決技巧:div{margin:30px!important;margin:28px;} 注意這兩個(gè)margin的順序一定不能寫反, important這個(gè)屬性IE不能識別,但別的瀏覽器可以識別。所以在IE下其實(shí)解釋成這樣:
div{maring:30px;margin:28px}重復(fù)定義的話按照最后一個(gè)來執(zhí)行,所以不可以只寫margin:xx px!important;#box{ width:600px; //for ie6.0- w\idth:500px; //for ff+ie6.0} #box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0-}
8.屬性選擇器(這個(gè)不能算是兼容,是隱藏css的一個(gè)bug)
p[id]{}div[id]{}
這個(gè)對于IE6.0和IE6.0以下的版本都隱藏,FF和OPera作用.屬性選擇器和子選擇器還是有區(qū)別的,子選擇器的范圍從形式來說縮小了,屬性選擇器的范圍比較大,如p[id]中,所有p標(biāo)簽中有id的都是同樣式的.
出處:web前端寒風(fēng)
責(zé)任編輯:bluehearts
上一頁 CSS兼容性(IE和Firefox)技巧大全 [4] 下一頁 CSS兼容性(IE和Firefox)技巧大全 [6]
◎進(jìn)入論壇網(wǎng)頁制作、WEB標(biāo)準(zhǔn)化版塊參加討論,我還想發(fā)表評論。
|