關於瀏覽器的相容問題(總結類、持續更新系列~)
糾結的相容性問題
我們在給網頁加 css 或者js時,往往要處理一些相容性的東西,比如要給某元素加一個屬性,在谷歌瀏覽器運行了一下,效果出來了,誒~美滋滋。然而當切換到IE瀏覽器的低版本的時候就出不來了,很雞肋的一件事情。這時候我們就要回去處理了,你不處理還不行,雖然現在用的都是一些主流瀏覽器,很少用IE的了,更別說IE低版本了,但你不能排除沒有人用,而且很多瀏覽器依然相容不了一些東西。
產品經理:偷懶?沒門!
在這裡總結一些相容性處理的辦法,為了防止以後忘記 :
一、清除浮動的相容性
.clearfix:after{
content:"";
clear:both;
display:block;
visibility:hidden;
height:0;
}
.clear{
*zoom:1;
}
二、透明度的相容性
opacity:0.3;
filter:alpha(opacity=30);
三、各種國外瀏覽器在CSS3中的相容問題
國內的瀏覽器的核心都是谷歌
Chrome的字首-webkit-
Firefox的字首-moz-
IE的字首-ms-
Opera的字首-o-
四、document獲取根節點的相容性(Ie6不支援document.documentElement)
var w=document.documentElement.clientWidth||document.body.clientWidth