一、css hack

  • 1)条件注释法
<!–[if !IE]> 除IE外都可识别 <![endif]–>
<!–[if IE]> 所有的IE可识别 <![endif]–>
<!–[if IE 6]> 仅IE6可识别 <![endif]–>
<!–[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]–>
<!–[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]–>
  • 2)类内属性前缀法
IE5 - 10 在属性值后加\9    color: red\9;
IE8 - 10 在属性值后加\0    color: red\0;
IE9 IE10 在属性值后加\9\0  color: red\9\0;
IE6 IE7 在属性前加星号     *color: red;
IE6 在属性前加下划线号     _color: red;
  • 3)选择器前缀法
目前最常见的是

*html *前缀只对IE6生效
*+html *+前缀只对IE7生效
@media screen\9{...}只对IE6/7生效
@media \0screen {body { background: red; }}只对IE8有效
@media \0screen\,screen\9{body { background: blue; }}只对IE6/7/8有效
@media screen\0 {body { background: green; }} 只对IE8/9/10有效
@media screen and (min-width:0\0) {body { background: gray; }} 只对IE9/10有效
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {body { background: orange; }} 只对IE10有效

@media all and (-ms-high-contrast:none) {
//这里是要单独为IE11设置的样式
}
  • 4)其它
针对火狐浏览器

@-moz-document url-prefix(){
    .selector{
       
    }
}

html5.js 兼容html5标签
IE8不支持H5和CSS3

<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->