`

HTML中的Hack手段之条件注释 <!--[if gte IE 6]><![endif]-->

    博客分类:
  • Html
 
阅读更多

转载:http://blog.csdn.net/wangchixiao/article/details/42172825

 

通常WEB的好处就是可以跨平台,但这个世界偏偏有个另类,就是IE浏览器。在平常做HTML设计时,有时需要为IE的表示差异而不得不使用一些Hack手段。条件注释就是这类手段之一。

       条件注释是IE浏览器的专利”,也就是说我们在HTML中可以为IE嵌入一段专有标签片段,来解决IE与其它浏览器的表现差异。条件注释是在IE5之后引入的,所有针对低于IE5<IE5.0)以前的浏览器使用条件注释的做法都是无效的。同时请注意微软已经不再针对IE10及以上浏览器支持条件注释了,所以请不要针对>=IE10IE浏览器增加条件注释。

       在HTML中,注释的格式通常是这样的:

[html] view plain copy
 
  1.     <!--注释内容-->  

       而条件注释是这样的:

[html] view plain copy
 
  1.    <!--[if IE 8]>  
  2.    <link href=”ie.css” rel=”stylesheet”/>  
  3.    <![endif]-->  

       在以上示例中,该条件注释会为版本小于等于IE8IE系列浏览器载入一段专有样式表单。

       条件注释可用的条件有:

1,lte(less than or equals to,小于或等于)

   <!--[if lte IE 6]><![endif]-->

2,lt(less than,小于)

<!--[if lte IE 6]><![endif]-->

3,gte(greater than or equals to,大于或等于)

   <!--[if gte IE 6]><![endif]-->

4,gt(greater than or equals to,大于)

   <!--[if gt IE 6]><![endif]-->

5,特定版本IE,IE 6 IE 7 IE 8

   <!—[if IE 6]><![endif]-->

6,排除版本!

   <!—[if !IE 6]><![endif]-->

        利用条件注释可以为IE浏览增加一些特定的后备代码。比如当用户使用IE8以前的浏览器是可以在页面中添加一段代码如下

[html] view plain copy
 
  1.     <!—[if it IE 8]><p>你的浏览器版本过低,请使用火狐,谷歌,或版本大于IE8的浏览器</p><![endif-->  

 

        条件注释虽然是IE特有的,但在针对IE系列浏览器时以上这段代码可以为我们精简部分判断浏览类型及版本的代码(这似乎是条件注释不可多得的好处之一)

分享到:
评论

相关推荐

    常见css BUG

    --[if gte IE 6]&gt; ... &lt;![endif]--&gt; ``` 9. **IE7专属Hack** ```html &lt;!--[if IE 7]&gt; ... &lt;![endif]--&gt; ``` 10. **低于IE7的Hack** ```html &lt;!--[if lt IE 7]&gt; ... &lt;![endif]--&gt; ``` 11. **IE7及...

    ie6兼容bug总结

    --[if gte IE 6]&gt; Only IE 6/+ &lt;![endif]--&gt;` - `&lt;!--[if lte IE 7]&gt; Only IE 7/- &lt;![endif]--&gt;` 在编写 CSS 时,结合这些 Hack 和过滤器,可以有效地管理 IE6 及其他浏览器的兼容性问题,确保页面在各种环境下都...

    IE系列的Css if hack条件语法

    --[if gte IE 6]&gt; Only IE 6/+ &lt;![endif]--&gt;` “gte”代表“greater than or equal to”(大于或等于),这表示IE6以及高于IE6的版本,包括IE6本身,都将应用这段CSS。 6. `&lt;!--[if lte IE 7]&gt; Only IE 7/- &lt;!...

    CSS Hack 汇总快查

    --[if gte IE6]&gt;Only IE6/+&lt;![endif]--&gt; ``` 这里使用`gte`关键字来指定只有等于或高于IE6版本的IE浏览器才能识别该Hack。 ```html &lt;!--[if lte IE7]&gt;Only IE7/-&lt;![endif]--&gt; ``` 这里使用`lte`关键字来指定只有...

    针对主流浏览器的CSS-HACK写法及IE常用条件注释

    --[if gte IE6]&gt;IE6以及IE6以上版本可识别&lt;![endif]--&gt; &lt;!--[if lte IE7]&gt;IE7以及IE7以下版本可识别&lt;![endif]--&gt; ``` 在使用这些条件注释时,需要注意注释的语法格式,确保在相应的IE版本中能够正确显示内容。 ...

    让网站支持老版本IE6、7、8、9浏览器的3种解决方案

    要使用HTML5 Shiv,只需在HTML文档的`&lt;head&gt;`部分加入特定条件注释,以确保只在IE的旧版本中加载它: ```html &lt;!--[if lt IE 9]&gt; &lt;script src="dist/html5shiv.js"&gt;&lt;/script&gt; &lt;![endif]--&gt; ``` 当旧版IE浏览器访问...

    CSS Hack 汇总快查 振之整理

    --[if gte IE 6]&gt; Only IE 6/+ &lt;![endif]--&gt;` - `&lt;!--[if lte IE 7]&gt; Only IE 7/- &lt;![endif]--&gt;` **总结** CSS Hack虽然可以帮助解决浏览器兼容性问题,但应当谨慎使用,因为它们可能导致代码可读性和维护性下降。...

    使用条件注释判断 IE 浏览器版本适用于IE5.0及以上版本

    --[if gt IE 6]&gt; &lt;!-- 这里是针对IE6以上版本的代码 --&gt; &lt;![endif]--&gt; ``` 条件注释的一个关键优点是它们可以在HTML文档的头部或主体中使用,而CSS Hack通常需要嵌入到CSS样式中,这可能导致代码混乱并增加维护...

    浏览器hack总结 详细的浏览器兼容性的快速解决方法

    --[if gte IE 7]&gt; 针对IE7及以上版本的内容 &lt;![endif]--&gt; &lt;!--[if !IE]&gt; 非IE浏览器的内容 &lt;![endif]--&gt; ``` 在实际开发中,随着IE6浏览器市场份额的大幅下降,很多公司和开发者不再针对IE6进行兼容性处理,而是将...

    详谈IE条件注释

    -- 这段内容只在IE6中显示 --&gt; &lt;![endif]--&gt; ``` IE条件注释的语法包含一些比较操作符,例如: - `!`:非运算符,用于反转条件。 - `lt`:小于运算符,检查浏览器版本是否小于指定版本。 - `lte`:小于或等于运算符...

    HTML/CSS对浏览器的判断

    --[if lte IE 6]--&gt;`将应用于IE6及其以下版本,而`&lt;!--[if IE 7]--&gt;`则仅适用于IE7。通过这种方式,开发者可以为不同版本的IE提供不同的CSS样式表,以解决兼容性问题。 除了条件注释,还可以使用CSS Hack来针对IE的...

    IE各版本hack汇总

    C[ifIE lt 7]&gt;`仅对IE6及以下版本有效,`&lt;!C[ifIE gte 8]&gt;`则对IE8及以上版本生效。 - **灵活控制**:通过这种方式,可以动态调整页面结构和样式,以适应不同版本的IE浏览器需求。 #### 3. 多色hack - **示例代码*...

    CSS HACK收集:关于IE6/FF/google等浏览器hack的方法详细

    –[if gte IE 6]&gt; 这段文字仅显示在 IE6及IE6以上版本。 &lt;![endif]–&gt; &lt;!–[if gt IE 6]&gt; 这段文字仅显示在 IE6以上版本(不包含IE6)。 &lt;![endif]–&gt; &lt;!–[if IE 5.5]&gt; 这段文字仅显示在 IE5.5。 &lt;!...

    css入门笔记

    &lt;ANY class="类名1 类名2 "&gt;&lt;ANY&gt; 4.id选择器 #id名{样式} 3.特殊选择器 1.群组选择器 #id ,.class{样式} 1.子选择器 #id&gt;.class{样式} 1.分类选择器 div .class{样式} 4.伪类选择器 作用:匹配元素...

Global site tag (gtag.js) - Google Analytics