虽然现在大部分方法都能兼容IE,但是难免有些功能需要特殊的兼容IE方法,所以还是需要了解一下。在学习过程中根据其他博客进行总结。
一、HTML兼容IE的方法
| 符号 | 含义 |
|---|---|
| if | 如果 |
| endif | 结束如果 |
| lte | 比较符号,小于等于 |
| IE | 浏览器品牌名称 |
| 9 | 表示版本 |
| lt | 小于 |
| gt | 大于 |
| gte | 大于等于 |
在html文件中这样使用:
<!--[if lte IE 8]>
<h2>您的浏览器版本过低,不支持新特性,请更新浏览器</h2>
<![endif]-->
<!--注释内容-->
<!--[if lte IE 9]>
<h2>小于等于 IE9 的浏览器可以看到</h2>
<![endif]-->
<!--[if lt IE 8]>
<h2>小于 IE8 的浏览器可以看到</h2>
<![endif]-->
<!--[if gte IE 8]>
<h2>大于等于 IE8 的浏览器可以看到</h2>
<![endif]-->
<!--[if IE 7]>
<h2>只有 IE7 浏览器可以看到</h2>
<![endif]-->
二、hack方法的实现
| hack符号 | 兼容浏览器 |
|---|---|
| - _ (属性名前面) | IE6及以下 |
| ! $ & * ( ) = % + @ , . / ` [ ] # ~ ? : < > I (属性名前面) | IE7及以下 |
| \0/ (属性值后面) | 仅IE8 |
| \0 (属性值后面) | IE8及以上 |
| \9 (属性值后面) | \9 (属性值后面) |
| * html .selector {} | IE6及以下 |
| .selector, {} | IE7及以下 |
| html > body .selector {} | 不兼容 IE6 及以下 |
| html > /**/ body .selector {} | 不兼容 IE6 及以下 |
| head ~ /* */ body .selector {} | 不兼容 IE6 及以下 |
在html文件中这样使用:
body {
/*IE6及以下*/
/* _background-color: pink; */
/*IE7及以下*/
/* ?background-color: green; */
/*IE8*/
/* background-color: gold\0/; */
/*IE8及以上*/
/* background-color: red\0; */
/*IE10及以下*/
/* background-color: red\9; */
}
参考文章:# IE浏览器兼容方法