IE 条件语句

用途

IE 条件语句包含在 HTML 注释语句中，只会被 IE 浏览器识别并执行，其他浏览器视其为 HTML 注释语句，于是全部被忽略，灵活使用 IE 条件语句可以开发出兼容不同版本的 IE 浏览器的样式。

解析

如果留意一下有些网站的源代码，有时会发现一些这样的代码：

1
2
3
4
5
6
7
<!--[if IE5]>
<style type="text/css">
    /*将IE5*的CSS盒模型宽高计算修正放在这个条件注释中*/
    #Test1 { width: 180px; }
    #Test2 { width: 190px; }
</style>
<![endif]-->

或者

1
2
3
4
5
6
7
<link href="css/index.css" type="text/css" />
<!--[if IE7]>
<link href="css/ie7.css" type="text/css" />
<![endif]-->
<!--[if IE6]>
<link href="css/ie7.css" type="text/css" />
<![endif]-->

_*标识符配对使用表示 HTML 注释语句。但是 IE 会把这些特殊的注释语句当做一个简单的逻辑语句进行解析。

  • 上面的第一段注释，表示如果当前浏览器是 IE 浏览器，则解析**标识符之间的样式表。而其他浏览器视而不见，当做注释语句全部忽略。因此可以在此放置一些能够兼容 IE 浏览器的样式代码。
  • 在上面的第二段代码中，分别使用了不同的条件语句来设置不同版本的 IE 浏览器中链接不同的 CSS 文件，这样，不同版本的 IE 浏览器就可以导入不同的样式表，以实现兼容性。

IE 条件语句的基本用法

IE 条件语句一般放在 HTML 注释语句中，这样可以避免其他浏览器因为无法解析这些条件语句时可能出现的尴尬。其基本语法如下：

1
2
3
<!--[if IE]>
    IE 下可执行语句
<![endif]-->
  • 条件语句放在中括号内，然后嵌入到 HTML 注释中。注意，起始条件标记中省略了 HTML 注释语句的后半部分标记（– –>），而结束标记中省略了 HTML 注释语句的前半部分标记（!– –），仅是一个半封闭的形式，这样对于其他浏览器来说，前后两个半封闭的 HTML 注释标记就形成了一个完整的注释标记，从而避免了由于其他浏览器无法解析的尴尬。
  • IE 浏览器在解析 HTML 源码时，如果遇到类似**标记时，会立即解析其中包含的源代码。
  • 在 IE 条件中可以放置一些简单的条件语句，或者设置成只能够在特定版本的浏览器中生效的源代码。

除了使用这些指定某种版本浏览器的条件语句之外，还可以结合 lte、lt、get、gt、！关键字来定义 IE 浏览器的版本范围，这些关键字的说明如下：

1
2
3
4
5
- lte: 小于或等于某个版本的IE浏览器。
- lt: 小于某个版本的IE浏览器。
- gte： 大于或等于某个版本的IE浏览器。
- gt： 大于某个版本的IE浏览器。
- ！：不等于某个版本的IE浏览器。