首页 > 计算机 >

IE中的条件注释

本文按署名·非商业用途·保持一致授权
作者:  ，发表于2005年11月27日17时06分 
原作地址:http://www.quirksmode.org/css/condcom.html
作者:ppk
翻译地址:http://www.surfchen.org/?p=94
翻译:surfchen

条件注释只能用于Explorer 5+ Windows(以下简称IE).
如果你安装了多个IE，条件注释（Conditional comments）将会以最高版本的IE为标准（一般为IE 6）。
我听说（但没测试过），当在条件注释中使用了小数点，且只安装了IE5.0的时候，将会产生一个不正确的判断。

条件注释只能在windows Internet Explorer(以下简称IE)下使用，因此我们可以通过条件注释来为IE添加特别的指令。条件注释从IE5开始被支持，它可能在IE5.0,5.5,6里有区别。
我（译者注：指作者）自己也在顶层的框架中使用了一些条件注释。如果你以源代码形式查看本页，你将会看到：
<!--[if IE]>
<style>
div.logo {
	margin-left: 10px;
}
</style>
<![endif]-->
以上代码的作用是：
一般情况下，div.logo的left margin将为22px。但是，IE有个BUG，就是当它碰到浮动元素（floated elements）的margins时候，它将会以2倍于该元素的实际margin值来处理。所以我要告诉IE，这个元素是10px(10?11?)。于是我用条件注释告诉了它。

这些代码例子将会概括性地说明你能如何使用条件注释以及你不能如何使用条件注释。

  1. 条件注释的基本结构和HTML的注释(<!-- -->)是一样的。因此IE以外的浏览器将会把它们看作是普通的注释而完全忽略它们。
  2. IE将会根据if条件来判断是否如解析普通的页面内容一样解析条件注释里的内容。
  3. 条件注释使用的是HTML的注释结构，因此他们只能使用在HTML文件里，而不能在CSS文件中使用。 我很想把所有特殊的样式放在logo.css里。但是很不幸的是，这看起来不太可能。我也试过根据条件注释，使用<link>来导入一个额外的样式表，但是因为我只需要一个额外的样式规则，这样会让事情变得复杂很多。当然如果你需要在IE里使用很多的额外的样式，那么使用<link>或许是一个好的方法。
例子: 下面我放置了一些条件判断来根据你的IE版本来输出相应信息。（如果你使用的浏览器不是IE，你将会什么都看不到）(译者注：由于我的BLOG的问题，目前即使是IE也看不到任何东西。)


代码如下：
<!--[if IE]>
根据条件判断，这是Internet Explorer<br />
< ![endif]-->
<!--[if IE 5]>
根据条件判断，这是Internet Explorer 5<br />
< ![endif]-->
<!--[if IE 5.0]>
根据条件判断，这是Internet Explorer 5.0<br />
< ![endif]-->
<!--[if IE 5.5]>
根据条件判断，这是Internet Explorer 5.5<br />
< ![endif]-->
<!--[if IE 6]>
根据条件判断，这是Internet Explorer 6<br />
< ![endif]-->
<!--[if gte IE 5]>
根据条件判断，这是Internet Explorer 5 或者更高<br />
< ![endif]-->
<!--[if lt IE 6]>
根据条件判断，这是版小于6的Internet Explorer<br />
< ![endif]-->
<!--[if lte IE 5.5]>
根据条件判断，这是Internet Explorer 5.5或更低<br />
< ![endif]-->
注意两个特殊的语法：
CSS hack? 条件判断属于CSS hack吗？严格地说是属于CSS hack。因为就好象其他真正的css hack一样，它使得我们可以给一些浏览器赋予特殊的样式，再则它不依赖于某个浏览器的BUG来控制另外一个浏览器（的样式）。除此之外，条件判断还能用来做一些超出CSS HACK范围的事情(虽然这种情况很少发生).。

因为条件判断不依赖于某个浏览器的hack,而是一个经过深思熟虑的特色功能，所以我相信它是可以被放心地使用的。当然，其他浏览器也有可能支持条件判断（到目前为止还没有），但是看起来，他们应该不会使用如<!--[if IE]>这样的语法。

我很节俭地使用条件判断。首先我会尝试着去寻找在IE上一个真正的CSS解决方法。如果找不到，我将会毫不犹豫地使用条件判断。

Comment标签:
一个读者告诉我，IE（Windows和Mac）支持<comment>标签（非标准）。
<p>这 <comment>不</comment> 是Internet Explorer.</p>

这 不 是Internet Explorer.

如果你想为非IE的浏览器使用专门的标签或样式，那么这个这个comment标签将会非常方便。不幸地是，这种情况很少发生（译者注：IE太烂？呵呵）。特别是这个标签，同时被windows和mac平台上的IE支持，而你往往只想在他们其中之一使用特殊的内容或样式。

28个评论

  1. IE7——一个解决IE与WEB标准的冲突的JS项目 @ 陈泽|SurfChen:
    2005-11-28 00:34:14

    [...] 其中<!–[if lt IE 7]>和< ![endif]–>是可以去掉的。但是我建议不要去掉。如果不知道这两个是什么，可以看这里。 [...]

  2.  @ 陈泽|SurfChen:
    2005-11-28 12:47:25

    [...] 原作地址:http://www.quirksmode.org/css/condcom.html 作者:ppk 翻译地址:http://www.surfchen.org/?p=94 翻译:surfchen 条件注释只能用于Explorer 5+ Windows(以下简称IE). 如果你安装了多个IE，条件注释（Conditional comments）将会以最高版本的IE为标准（一般为IE 6）。 我听说（但没测试过），当在条件注释中使用了小数点，且只安装了IE5.0的时候，将会产生一个不正确的判断。 条件注释只能在windows Internet Explorer(以下简称IE)下使用，因此我们可以通过条件注释来为IE添加特别的指令。条件注释从IE5开始被支持，它可能在IE5.0,5.5,6里有区别。 我（译者注：指作者）自己也在顶层的框架中使用了一些条件注释。如果你以源代码形式查看本页，你将会看到： <!–[if IE]> <style> div.logo { margin-left: 10px; } </style> <![endif]–> 以上代码的作用是： 一般情况下，div.logo的left margin将为22px。但是，IE有个BUG，就是当它碰到浮动元素（floated elements）的margins时候，它将会以2倍于该元素的实际margin值来处理。所以我要告诉IE，这个元素是10px(10?11?)。于是我用条件注释告诉了它。 这些代码例子将会概括性地说明你能如何使用条件注释以及你不能如何使用条件注释。 [...]

  3. Anonymous:
    2006-12-09 22:11:55

  4. 混合机:
    2006-12-28 08:21:48

    欢迎访问上海耐佳机电工程有限公司网站:
    http://www.shnjjd.com

  5. 盐酸解析:
    2007-02-06 21:40:09

    欢迎访问外环网

  6. IE中的条件注释 @ 随网之舞:
    2007-03-26 03:01:11

    [...] [1]IE中的条件注释 [...]

  7. 混合机:
    2007-04-10 21:41:37

    Welcome to Shanghai Natural M & E Engineering Co., Ltd.
    欢迎访问上海耐佳机电工程有限公司网站：
    混合机

  8. 化妆品设备:
    2007-04-10 21:45:40

    欢迎访问无锡南泉精工机械厂
    乳化机

  9. 网络公司:
    2007-04-20 08:53:09

    网络公司

  10. 广州网络公司:
    2007-04-20 08:53:35

    广州网络公司

  11. mold manufacturer:
    2007-04-22 09:29:31

    好文章!!

  12. game machine:
    2007-04-22 09:30:30

    支持!!

  13. air bed:
    2007-04-22 09:37:54

    收藏了~

  14. air bed:
    2007-04-22 09:38:44

    不错!!

  15. 电影网:
    2007-04-22 10:07:35

    写的很好!!

  16. 手机:
    2007-04-22 10:07:59

    支持~

  17. 功率电感:
    2007-04-22 10:08:32

    顶!!

  18. 测厚仪:
    2007-04-22 10:09:35

    顶,好文章!!

  19. 制氮机:
    2007-04-22 10:10:12

    我会常回来看看你的文章的.

  20. 佳能数码相机:
    2007-04-22 10:10:39

    很好,我喜欢!!

  21. 楓之谷外掛:
    2007-05-02 20:27:56

    看ㄋ你的文章，很有感覺的說．我自己也做網站，希望可以多多交流一下，大家保持聯繫．
    http://www.gameon9.com/

  22. 测试:
    2007-06-04 21:51:23

    测试者

  23. 搬家:
    2007-10-25 16:48:44

    试一下.

  24. Holzspielzeug TIMBaER:
    2008-04-23 01:09:55

    很好,我喜欢!!

  25. Zahnersatz:
    2008-05-06 22:51:15

    网络公司

  26. IE7.js–解决低版本IE与WEB标准不兼容的JS库 - 回到未来 - jacob1970:
    2008-06-19 01:34:40

    [...] 其中<!–[if lt IE 7]>和< ![endif]–>是可以去掉的。但是建议不要去掉。如果不知道这两个是什么意思，可以看这里。 [...]

  27. laobaozhi:
    2008-06-27 10:01:50

    很好的文章

  28. 贪污罪的表现:
    2008-09-02 09:24:11

    在CSS文件中怎么写条件注释?

发表评论

  本站文章若无注明，则以署名·非商业用途·保持一致授权
  桂ICP备05004302号 感谢医元网提供主机 感谢WordPress提供本程序 本模板下载