IE Firefox css 差别 [转]
生活随笔
收集整理的這篇文章主要介紹了
IE Firefox css 差别 [转]
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
1、單位問題
問題:任何距離的數(shù)值ie可以不加單位,ff必須要求寫單位(0除外)
解決:寫全單位如padding:0px;
2、水平居中
問題:div里的內(nèi)容,ie默認(rèn)為center,而ff默認(rèn)left
解決:mairgin:0px auto;
3、高度問題
問題:如果設(shè)置了一個(gè)DIV的高度,當(dāng)DIV里實(shí)際內(nèi)容大于所設(shè)高度,ie會(huì)自動(dòng)拉伸以適應(yīng)DIV容器大小,ff會(huì)固定DIV的告訴,超過部分超出DIV底線以外,出現(xiàn)和下面的內(nèi)容重疊的現(xiàn)象
解決:控制恰當(dāng)?shù)母叨?#xff0c;或者不寫,讓瀏覽器自動(dòng)調(diào)節(jié)高度,或者設(shè)置overflow:hidden;
4、clear:both;
問題:如果上面用float控制了n列DIV,下面ie會(huì)自動(dòng)檢測(cè)自動(dòng)排列,ff則可能很不老實(shí),到處亂動(dòng)
解決:float結(jié)束后的下一個(gè)標(biāo)簽加clear:both;以結(jié)束float的控制
5、最大/小寬度問題
問題:min-width,max-width只是ff的命令,如何讓ie實(shí)現(xiàn)同樣的效果
解決:ie不認(rèn)識(shí)min-和max-,實(shí)際ie認(rèn)為min-width、max-width和width效果一樣,可以用下面方法解決
#cctext{
min-width: 700px;
max-width: 1000px;
width:expression(document.body.clientWidth<700 ? "700px" : document.body.clientWidth>1000 ? "1000px" : "auto");
}
6、!important支持
問題:ff支持ie不支持
解決:無。ie會(huì)忽略。
7、游標(biāo)狀態(tài)
問題:cursor:hand;僅ie支持,顯示手指狀態(tài)
解決:使用cursor:pointer;ie和ff都支持
8、實(shí)際像素
IE/Opera:對(duì)象的實(shí)際寬度 = (margin-left) + width + (margin-right)
Firefox/Mozilla:對(duì)象的實(shí)際寬度= (margin-left) + (border-left-width) + (padding- left) + width + (padding-right) + (border-right-width) + (margin-right)
所以排列好及列的表格時(shí)ie和ff顯示寬度稍有區(qū)別
問題:任何距離的數(shù)值ie可以不加單位,ff必須要求寫單位(0除外)
解決:寫全單位如padding:0px;
2、水平居中
問題:div里的內(nèi)容,ie默認(rèn)為center,而ff默認(rèn)left
解決:mairgin:0px auto;
3、高度問題
問題:如果設(shè)置了一個(gè)DIV的高度,當(dāng)DIV里實(shí)際內(nèi)容大于所設(shè)高度,ie會(huì)自動(dòng)拉伸以適應(yīng)DIV容器大小,ff會(huì)固定DIV的告訴,超過部分超出DIV底線以外,出現(xiàn)和下面的內(nèi)容重疊的現(xiàn)象
解決:控制恰當(dāng)?shù)母叨?#xff0c;或者不寫,讓瀏覽器自動(dòng)調(diào)節(jié)高度,或者設(shè)置overflow:hidden;
4、clear:both;
問題:如果上面用float控制了n列DIV,下面ie會(huì)自動(dòng)檢測(cè)自動(dòng)排列,ff則可能很不老實(shí),到處亂動(dòng)
解決:float結(jié)束后的下一個(gè)標(biāo)簽加clear:both;以結(jié)束float的控制
5、最大/小寬度問題
問題:min-width,max-width只是ff的命令,如何讓ie實(shí)現(xiàn)同樣的效果
解決:ie不認(rèn)識(shí)min-和max-,實(shí)際ie認(rèn)為min-width、max-width和width效果一樣,可以用下面方法解決
#cctext{
min-width: 700px;
max-width: 1000px;
width:expression(document.body.clientWidth<700 ? "700px" : document.body.clientWidth>1000 ? "1000px" : "auto");
}
6、!important支持
問題:ff支持ie不支持
解決:無。ie會(huì)忽略。
7、游標(biāo)狀態(tài)
問題:cursor:hand;僅ie支持,顯示手指狀態(tài)
解決:使用cursor:pointer;ie和ff都支持
8、實(shí)際像素
IE/Opera:對(duì)象的實(shí)際寬度 = (margin-left) + width + (margin-right)
Firefox/Mozilla:對(duì)象的實(shí)際寬度= (margin-left) + (border-left-width) + (padding- left) + width + (padding-right) + (border-right-width) + (margin-right)
所以排列好及列的表格時(shí)ie和ff顯示寬度稍有區(qū)別
轉(zhuǎn)載于:https://www.cnblogs.com/anson2020/archive/2008/02/01/1060831.html
總結(jié)
以上是生活随笔為你收集整理的IE Firefox css 差别 [转]的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: struts中多个模块时,使用多个str
- 下一篇: 关于控件postback 后viewst