【IE】CSS版本兼容&JS检测

2019-12-23  本文已影响0人  ShineaSYR

1. IECss hack

参考来源:区分IE8/IE7/IE6及其他浏览器-CSS “\9″hack
IE8-: '\9', IE7-: *;
注:部分方法为同事内部分享,纯记录向

区分 方法 caniuse/eg
IE&其他浏览器 ::-webkit-whatever
IE9&其他浏览器 :invalid
IE8&其他浏览器 :enabled
IE8&其他浏览器 :root
IE7 * *display:inline;
/*区分IE8和其他浏览器*/
/*:root选择器会提高优先级*/
.cl {
    /*IE8*/
    color: #aaa;
}
.cl, xxx:enabled {
    color: #bbb;
}

/*区分IE9和其他浏览器*/
.cl {
    /*IE9*/
    color: #aaa;
}
.cl, xxx:invalid {
    color: #bbb;
}
/*IE9特殊*/
xxx {
    /*一倍图兜底*/
    background-image: url("");
    /*IE9+ 二倍图 or svg*/
    background-image: url(""), none;
}

/*区分IE和其他浏览器*/
.cl {
    /*IE*/
    color: #aaa;
}
.cl, span::-webkit-scrollbar {
    /*chrome、firefox*/
    color: #bbb;
}

2. IE 版本检测

版本 方法1 caniuse
IE !('open' in document.createElement('details'))
IE8- !document.addEventListener
IE9- !history.pushState
上一篇 下一篇

猜你喜欢

热点阅读