ie兼容

2016-09-29  本文已影响0人  大道路漫漫

一:适用于个别元素,单独写兼容

_color : #fff ;                  6
*+color : #fff ;                 7
*color : #fff ;                  6,7
color : #fff\0 ;                 8,9,10
color : #fff\9\0 ;               9,10
color : #fff\9 ;                 6,7,8,9,10

那怎么单独控制ie8 ?看下面:
color : #fff ;
color : #fff\9\0 ;
color : #000\0 ;                ie8
是不是只在ie8下变成黑色

</br>

二:适用于单独引入针对ie的样式

<!--[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]-->
<!--[if IE 7]>            仅IE7可识别     <![endif]-->
<!--[if lt IE 7]>         IE7以及IE7以下版本可识别     <![endif]-->
<!--[if gte IE 7]>        IE7以及IE7以上版本可识别     <![endif]-->
<!--[if IE 8]>            仅IE8可识别     <![endif]-->
<!-- [if lt IE 8]>        IE8及以下    <![endif] -->
<!-- [if gte iE 8]>       IE8及以上    <![endif] -->
<!--[if IE 9]>            仅IE9可识别     <![endif]-->
<!-- [if lt IE 9]>        IE9及以下    <![endif] -->
<!-- [if gte IE 9]>       IE9及以上     < ![endif] -->

不懂?举个栗子
<link rel="stylesheet" href="css/font-awesome.min.css">
<!--[if IE 7]>
        <link rel="stylesheet" href="css/font-awesome-ie7.min.css">
<![endif]-->

</br>

三:适用于引入部分针对ie的样式,放在一起

仅IE6和IE7识别
@media screen\9 {
    .selector {  font-size: 20px;
} } 

仅IE6和IE7、IE8识别
@media \0screen\,screen\9 {
    .selector {  font-size: 20px;
} }

仅IE8识别
@media \0screen {
    .selector {  font-size: 20px;
} }

仅IE8-10识别
@media screen\0 {
    .selector {  font-size: 20px;
} } 

仅IE9和IE10识别
@media screen and (min-width:0\0) {
    .selector {  font-size: 20px;
} } 

</br>

四:不想写兼容肿么办?

加入下面这行代码:
<!--[if lte IE 8]>
<script>[size=normal]
window.location.href='http://www.chinaedu.net/upgrade-your-browser.html?referrer='+location.href;
</script>
<![endif]-->
强制用户使用ie9以上的浏览器

上一篇下一篇

猜你喜欢

热点阅读