关于IE的一些hack-蒲公英云

关于IE的一些hack

TIPS：对于完全放弃IE的幸福开发者，以下内容全是废话，建议跳转到博客园着页，寻找更优质的文章。

对于前端开发来说IE一直是心里的痛，不管你觉得做的多好的网页，放到它上面总会有一些意想不到的问题发生，所以你不得不针对IE单独做些手脚,你就有必要知道一些IE浏览器下的hack写法。

比较常用的几个hack(目前大多公司都只要求兼容到IE8，稍微变态点的也就是IE7下没大的错位就行了，下面hack足以):

\9 像如6.5em;width:8em\9;在ie7-ie10宽度是8em;

\0 像如6.5em;width:8em\0;在ie8-ie11宽度是8em;

* 像如6.5em;*width:8em ie7以下会宽度是8em

针对IE11还可以通过以下媒体查询的方式来解决IE11下的问题:

@media screen and(-ms-high-contrast:active),(-ms-high-contrast:none) {

　　　　div{width:8em;}

}

加上以上代码可以让IE11下div的宽度为8em,为了避免IE低版本下也会认识这一媒体查询，最好在screen前加上only。

在IE浏览器下，特别是IE8以下个人感觉真真没必要去太折腾(win7的最低配置都是ie8了)，但是为了更好的体验，可以针对IE8以下浏览器给出一个友善的升级提示也是很不错的，IE下的条件注释语句值得拥有：

//ie7及以下会提示用户去升级浏览器
<!--[if lte IE 7]>
 <div class="browser-upgrade">你的浏览器版本过低，请到<a href="http://browsehappy.com" class="browser-upgrade__link">这里</a>更新，以获取最佳体验!</div>
<![endif]-->

条件语句还有更多用途，在使用html5新增标签页面可以针对IE低版本引入htmlshiv让低版本浏览器也能识别html新增标签:

<!--[if lt IE 9]>
<script type="text/javascript"  src="http://www.ijquery.cn/js/html5shiv.js"></script>
<![endif]-->

ie的条件语句常用的有几下几种（所有条件注释语句在非IE浏览器下都是普通的注释，不要用非ie去给非IE的浏览执行操作）：

lt ：就是Less than的简写，也就是小于的意思。

lte ：就是Less than or equal to的简写，也就是小于或等于的意思。

gt ：就是Greater than的简写，也就是大于的意思。

gte：就是Greater than or equal to的简写，也就是大于或等于的意思。

!：就是不等于的意思，跟javascript里的不等于判断符相同。

<!--[if IE]>
    只有IE才支持
<![endif]-->
<!--[if !IE 7]>
    IE7不支持
<![endif]-->
<!--[if lt IE 8]>
    IE8以下浏览器才支持
<![endif]-->
<!--[if lte IE 8]>
    IE8及以下浏览器才支持
<![endif]-->
<!--[if gt IE 8]>
    IE8以上浏览器才支持
<![endif]-->
<!--[if gte IE 8]>
    IE8及以上浏览器才支持
<![endif]-->