一、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]-->