資源描述：
《css與javascript跨瀏覽器兼容性總結(jié)》由會員上傳分享，免費在線閱讀，更多相關(guān)內(nèi)容在學(xué)術(shù)論文-天天文庫。
1、css與javascript跨瀏覽器兼容性總結(jié)一、CSS樣式兼容性1.float閉合（clearingfloat）網(wǎng)頁在某些瀏覽器上顯示錯位很多時候都是因為使用了float浮動而沒有真正閉合，這也是div無法自適應(yīng)高度的一個原因。如果父div沒有設(shè)float而其子div卻設(shè)了float的話，父div無法包住整個子div,這種情況一般出現(xiàn)在一個父div下包含多個子div。解決辦法：1）給父div也設(shè)上float2）在所有子div后新加一個空div（目前ext是這么做的），比如：.parent{width:lOO
2、px;}.sonl{float:left:width:20px;}.son2{float:left;width:80px;}.clear{clear:both;margin:0;pardingO;height:0px;font~size:0px:}It;divelass=parentgt;lt;divclass=sonlgt;It;/divgt:It;divc1ass=son2gt;It;/divgt;It;divclass=cleargt:1t:/divgt:It:/divgt;3）萬能float閉合將以下
3、代碼加入globaless中，給需要閉合的div加上class=”clearfix”即可，屢試不爽。It;stylegt:/*clearfix*/.clearfix:after{content:.:display:block;height:0;clear:both;visibility:hidden;.clearfix{display:inline-block;}Ahidefromiemac*/.clearfix{display:block;}/氺endhidefromiemac*/Aendofclearfi
4、x*/It;/stylegt;:after（偽對象），設(shè)置在對象后發(fā)生的內(nèi)容，通常和content配合使用，ie不支持此偽對象，非ie瀏覽器支持，所以并不影響到ie/win瀏覽器。這種的最麻煩。4）overflow:auto只要在父div的css中加上overflow:auto就搞定舉例:.parent{width:100px;overflow:auto}.sonl{f1oat:left;width:20px;}.son2{float:left;width:80px;}1t;divclass=parentgt
5、;It;divelass=sonlgt:It:/divgt;It:divclass=son2gt;It;/divgt;It;/divgt;原理是，外圍元素之所以不能很好的延伸，問題出在了overflow上，因為overflow不可見（見w3c的解釋）?，F(xiàn)在只要將給外圍元素添加一個“overflow:auto”，就可以解決問題，結(jié)果是除了ie，真的可以解決。下來就要解決ie的問題了，再加上“Jieight:l%”，這個問題就完全解決了。我試了一下，其實不加_height:l%“在ie下也行留著吧。2.截字省略號
6、?hh{-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap:overflow:hidden;這個是在越出長度后會自行的截掉多出部分的文字，并以省略號結(jié)尾。技術(shù)是好技術(shù)，很多人都喜歡亂用，但注意firefox并不支持It;metahttp-equiv=x-ua-compatiblecontent=ie=7/gt;頁面加上這句就可以讓頁面兼容ie7了供參考！給大家提醒一個漂浮需要注意的問題注意設(shè)置div寬和高注意設(shè)置overflo
7、w:hidden;注意閉合針對火狐父div樣式display:inline-block;2.cursor:hand和cursor:pointerfirefox不支持hand，但ie支持pointer解決方法：統(tǒng)一使用pointer4.css透明幾款瀏覽器對透明度的支持方式各不相同，為了保證在ie，firefox，chrome,safari等主流瀏覽器下都能正常顯示透明度的效果，我們可以定義一個透明度的class,因為一寫就要寫3條，省的每次都復(fù)制來復(fù)制去了。具體代碼如下：.transparent{filter
8、:alpha(opacity=60):/*支持ie瀏覽器*/-moz-opacity:0.6;/*支持firefox瀏覽器*/opacity:0.6;/*支持chrome,opera,safari等瀏覽器*/}5.css中的width和padding在ie7和ff中width寬度不包括padding，在ie6中包括padding。二、javascript兼容1.children與childnodes
