color:red; color:red !important; _color:red; *color:red; +color:red; *+color:red; color:red\9; color:red\; color:red\0; color:red\9\0; @media all and (min-width: 0px){ div{color:red;} } @media screen and (-webkit-min-device-pixel-ratio:0){ div{color:red;} } @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel- ratio:0) { div{color:red;} } html>body div, x:-moz-any-link, x:default {color:red;} } body:nth-of-type(1) p{color:red;} <!--[if lt IE 7 ]> <html class="ie6"> <![endif]--> <!--[if IE 7 ]> <html class="ie7"> <![endif]--> <!--[if IE 8 ]> <html class="ie8"> <![endif]--> <!--[if IE 9 ]> <html class="ie9"> <![endif]--> <!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]--> <!–[if IE 7]> = 等于 IE7 <!–[if lt IE 8]> = 小于 IE8(就是 IE7 或以下了啦) <!–[if gte IE 8]> = 大于或等于 IE8 <meta http-equiv="x-ua-compatible" content="ie=7" /> 把这段代码放到<head>里面,在ie8里面的页面解析起来就跟ie7一模一样的了 <!–[if IE]> <link rel=”stylesheet” href=”/ie-all.css” type=”text/css” media=”screen” /> <![endif]–> <!–[if lt IE 8]> <link rel=”stylesheet” href=”/ie.css” type=”text/css” media=”screen” /> <![endif]–> <!–[if IE 7]> <link rel=”stylesheet” href=”/ie7.css” type=”text/css” media=”screen” /> <![endif]–> <!–[if IE 6]> <link rel=”stylesheet” href=”/ie6.css” type=”text/css” media=”screen” /> <![endif]–>
在对浏览器兼容性要求越来越高的时候,大家是否正在寻找一个完整的解决方案呢?更新版的CSS
.class{ background- color:# * _ } @media .class{ background-color:#FF00FF; } @media .class{ background- color:#FF00FF; html* background-color:# } }} |
整理:兼容 IE、Firefox、Opera和Safari
|