css hack

js中比较多是使用UA来判断当前浏览器环境：

var getBrowserVer =  function() {
            var userAgent = navigator.userAgent.toLowerCase();
            var mozilla = /firefox/i.test(userAgent);
            var chrome = /chrome/i.test(userAgent);
            var opera = /opera/i.test(userAgent);
            var safari = /safari/i.test(userAgent);
            var msie = /msie/i.test(userAgent);

            if(mozilla){
                return "Firefox";
            }else if(chrome){
                return "Chrome";
            }else if(opera){
                return "Opera";
            }else if(safari){
                return "Safari";
            }else if(msie){
                return "IE";
            }else{
                return "unknown";
            }
        };

对于不同的ie环境测试方案，IE11自带的开发者工具：

好奇为什么就是没有6呢？

 

以下代码来自360导航，不同环境下，打上不同的类

<!--[if lt IE 7 ]><html class="ie6" lang="zh-cn"><![endif]-->
<!--[if IE 7 ]><html class="ie7" lang="zh-cn"><![endif]-->
<!--[if IE 8 ]><html class="ie8" lang="zh-cn"><![endif]-->
<!--[if IE 9 ]><html class="ie9" lang="zh-cn"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html class="" lang="zh-cn"><!--<![endif]-->

总结出几个重要的：

\9    ：所有IE浏览器都支持
._和-  ：仅IE6支持
*     ：IE6、E7支持
\0\9  ：IE8、IE9支持

 

例子：

用CSS分别定义IE6、7、8的width属性，使其在IE6下的值为10px，IE7为20px，IE8为30px？

{
width:30px\9;
*width:20px;
_width:10px;
}

注意顺序不可颠倒

posted @ 2017-09-17 14:46  HelloHello233  阅读(235)  评论(0)  编辑  收藏  举报