本文概述
有时(几乎总是)在设计网站时, 有必要根据浏览器应用不同的规则和样式。这样, 你可以修复浏览器的任何可能的错误和限制, 而不会影响任何其他浏览器。
自Internet Explorer 5以来, Microsoft引入了一种称为条件注释的机制, 该机制仍包含最新版本, 并允许你根据浏览器的版本来应用不同的CSS样式或脚本。
条件注释的语法基于普通的HTML注释, 即:
<!-- Normal HTML comment -->
<!--[if expression]> Conditional content <![endif]-->
条件注释的语法允许你在Internet Explorer系列以外的任何浏览器中忽略你的内容。通过组合标识符, 运算符和值来创建表达式。唯一标识符是定义的IE, 它使你可以创建最简单和有用的条件注释:
<!--[if IE]>
This browser is internet explorer (any version)
<![endif]-->
如果要将条件注释的范围限制为Internet Explorer的单个版本, 则可以直接指出版本号, 即:
<!--[if IE 5.5]>
this browser is Internet Explorer 5.5
<![endif]-->
<!--[if IE 6]>
this browser is Internet Explorer 6
<![endif]-->
<!--[if IE 8]>
this browser is Internet Explorer 8
<![endif]-->
IE> = 10
从Internet Explorer 10和更高版本开始, 以前的语法不再起作用。而是使用以下语法(请注意, 运算符仍照常工作):
<!--[if gte IE 10]><!-->
Include any style or script here if IE version is 10 or upper
<!--<![endif]-->
所以用例应该是:
<!--[if lt IE 9]>
This is less than IE9
<![endif]-->
<!--[if gt IE 8]> <!-- -->
this is all browsers: IE9 or higher, firefox, chrome, etc.
<!-- <![endif]-->
操作符
条件注释使你可以使用像:这样的运算符! (not), lt(小于), lte(小于或等于), gt(大于), gte(大于或等于)。
最后, 也可以使用更复杂的运算符, 类似于在编程语言中可以找到的运算符:&&(and), |。 (要么)。你也可以使用括号创建高级表达式。
不是(!)
条件注释定义的最简单的运算符是取反运算符, 它在表达式之前指示以识别相反的结果(!):
<!--[if !IE]><!-->
Any browser except internet explorer
<!--<![endif]-->
小于(lt)
使用小于来标识比你的规范更旧的版本:
<!--[if lt IE 7]>
Any previous version to Internet Explorer 7
<![endif]-->
小于或等于(lte)
使用小于或等于来标识任何旧版本或等同于你的规范:
<!--[if lte IE 6]>
This browser is Internet Explorer 6 or any previous version
<![endif]-->
大于(gt)
使用大于号来标识任何超出规范的版本:
<!--[if gt IE 7]>
This browser is newer than Internet Explorer 7
<![endif]-->
大于或等于(GTE)
使用大于号来标识任何更大的版本或等同于你的规范:
<!--[if gte IE 8]>
This browser is Internet Explorer 8 or any upper version
<![endif]-->
和(&)
AND运算符(&)组合两个表达式以创建一个条件, 只有当两个表达式均为true时, 该条件才会完成:
<!--[if (gt IE 5) & !(IE 8)]>
This browser is ANY upper version than Internet explorer 5 EXCEPT Internet explorer 8
<![endif]-->
或(|)
OR运算符(|)还会组合两个表达式并在两个表达式中的至少一个为true时创建条件:
<!--[if (IE 7) | (IE 8)]>
This browser is Internet Explorer 7 or Internet Explorer 8
<![endif]-->
玩得开心