在上一篇blog里面提到IE有不同的显示模式以及如何用Javascript 来动态判定。 Web开发者可以根据不同显示模式导入不同的内容。
这篇blog 主要讲如何让静态HTML代码根据不同IE版本显示不同内容。 这里的技巧就是利用IE的HTML注释表达式。
HTML 的注释格式是 <!-- Comment content --> , IE 对HTML注释做了一些扩展,使之可以支持条件判断表达式:
<!--[if expression]> HTML <![endif]--> 当表达式expression 为True 的时候,显示 HTML 内容。
例子:
view plaincopy to clipboardprint?
<!--[if IE 5]>
<p>Welcome to Internet Explorer 5.</p>
<![endif]-->
<!--[if IE 5]>
<p>Welcome to Internet Explorer 5.</p>
<![endif]-->
和编程语言类似,这里的表达式还支持大于(gt)、小于(lt)、 与或非 等操作符。 下面是一些例子。
[if IE] 判断是否IE
[if IE 7] 判断是否是IE7
[if !IE] 判断是否不是IE
[if lt IE 5.5] 判断是否是IE5.5 以下版本。 (<)
[if lte IE 6] 判断是否等于IE6 版本或者以下 (<=)
[if gt IE 5] 判断是否IE5以上版本 (> )
[if gte IE 7] 判断是否 IE7 版本或者以上
[if !(IE 7)] 判断是否不是IE7
[if (gt IE 5)&(lt IE 7)] 判断是否大于IE5, 小于IE7
[if (IE 6)|(IE 7)] 判断是否IE6 或者 IE7
代码示例:
view plaincopy to clipboardprint?
<!--[if IE]><p>You are using Internet Explorer.</p><![endif]-->
<![if !IE]><p>You are not using Internet Explorer.</p><![endif]>

<!--[if IE 7]><p>Welcome to Internet Explorer 7!</p><![endif]-->
<!--[if !(IE 7)]><p>You are not using version 7.</p><![endif]-->

<!--[if gte IE 7]><p>You are using IE 7 or greater.</p><![endif]-->
<!--[if (IE 5)]><p>You are using IE 5 (any version).</p><![endif]-->
<!--[if (gte IE 5.5)&(lt IE 7)]><p>You are using IE 5.5 or IE 6.</p><![endif]-->
<!--[if lt IE 5.5]><p>Please upgrade your version of Internet Explorer.</p><![endif]-->
<!--[if IE]><p>You are using Internet Explorer.</p><![endif]-->
<![if !IE]><p>You are not using Internet Explorer.</p><![endif]>
<!--[if IE 7]><p>Welcome to Internet Explorer 7!</p><![endif]-->
<!--[if !(IE 7)]><p>You are not using version 7.</p><![endif]-->
<!--[if gte IE 7]><p>You are using IE 7 or greater.</p><![endif]-->
<!--[if (IE 5)]><p>You are using IE 5 (any version).</p><![endif]-->
<!--[if (gte IE 5.5)&(lt IE 7)]><p>You are using IE 5.5 or IE 6.</p><![endif]-->
<!--[if lt IE 5.5]><p>Please upgrade your version of Internet Explorer.</p><![endif]-->

注:IE5 以下的版本不支持这种注释扩展。 不过现在也很难找到IE4了 ... :)

[Web开发] 在HTML代码里面如何判断IE版本的更多相关文章

  1. javaSE web开发 登录思路代码

    准备工作: 1.在WebContent  WEB-INF   lib下添加c3p0-0.9.5.2.jar     mchange-common-java-0.2.11.jar   ojdbc6.ja ...

  2. 【初码干货】使用阿里云对Web开发中的资源文件进行CDN加速的深入研究和实践

    提示:阅读本文需提前了解的相关知识 1.阿里云(https://www.aliyun.com) 2.阿里云CDN(https://www.aliyun.com/product/cdn) 3.阿里云OS ...

  3. 转载:移动web开发规范

    本文来源:http://blog.csdn.net/joueu/article/details/44329825 以下是规范建议,均是日常在开发当中的的一些经验,仅供参考. 移动web开发规范 一.头 ...

  4. js/jquery/html前端开发常用到代码片段

    1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE ...

  5. 移动端web开发进阶

    三个月前曾写过一篇跨终端响应式页面设计入门的博客,上了博客园头条也得到了不少关注,今天想在这篇博客的基础上,继续写一篇进阶的文章. 补充 基于“入门”一文,我想再补充几个基础知识点,主要都是针对iOS ...

  6. 【原创】三分钟教你学会MVC框架——基于java web开发(2)

    没想到我的上一篇博客有这么多人看,还有几位看完之后给我留言加油,不胜感激,备受鼓励,啥都别说了,继续系列文章之第二篇.(如果没看过我第一篇博客的朋友,可以到我的主页上先浏览完再看这篇文章,以免上下文对 ...

  7. Web开发基本准则-55实录-Web访问安全

    Web开发工程师请阅读下面的前端开发准则,这是第一部分,强调了过去几年里我们注意到的Web工程师务须处理的Web访问安全基础点.尤其是一些从传统软件开发转入互联网开发的工程师,请仔细阅读,不要因为忽视 ...

  8. 快速使用node.js进行web开发

    首先关于node.js的学习,这里推荐一本比较好的教程,nodejs web开发指南,该书通俗易懂地将node.js语言特性讲解完之后,又从一个项目角度带领读者使用node.js学习web开发.相信这 ...

  9. Web 开发常见安全问题

    不是所有 Web 开发者都有安全的概念,甚至可能某些安全漏洞从来都没听说过.这就是这篇科普文章的存在意义,希望 Web 开发者在开发时能依此逐条检查代码中的安全问题. 注:服务器运维相关的安全注意事项 ...

随机推荐

  1. [Java入门笔记] Java语言基础(三):运算符

    简介 运算符是一种特殊的符号,运算符是通过一定的运算规则操作一个或多个操作数,并生成结果的特定符号,运算符和操作数的有效组合称为表达式. Java中运算符主要分为以下几类: 赋值运算符 算术运算符 关 ...

  2. 自动创建WIN32下多级子目录的C++封装类

            这是 WIN32 自动创建多级子目录的 C++ 封装类,用法简单.         封装没有采用类的静态函数方式,而是在构造函数里面直接完成工作.没什么具体的原因,只是当时做成这样了, ...

  3. CentOS 7 虚拟机无法开机问题

    若虚拟机在不正常关机的时候会遇到如下图所示的问题:先点击"取消"按钮

  4. 关于 Java 中 finally 语句块的深度辨析

    应该有很多人对java的finally 理解的不是很透彻吧,这里有篇文章讲的非常深入.猛击下面链接.面试时经常问到这问题 http://www.ibm.com/developerworks/cn/ja ...

  5. 解决Android Graphical Layout 界面效果不显示

    解决Android Graphical Layout 界面效果不显示 qq463431476

  6. Ubuntu安装Svn,提供http访问

    安装相关package sudo apt-get install subversion subversion-tools apache2 libapache2-svn apache2-utils 创建 ...

  7. 用javascript插入样式

    一.用javascript插入<style>样式 有时候我们需要利用js来动态生成页面上style标签中的css代码,方法很直接,就是直接创建一个style元素,然后设置style元素里面 ...

  8. 读 [The Root of Lisp]

    首先,在对 Lisp 有一丢丢的了解下读这篇文章会大大激发你学下去的欲望.之后可以看作者的著作<ANSI Common Lisp>. 想要体会一下 Lisp 的强大,本文是不二之选. Co ...

  9. runv nslistener源码分析

    nslistener的作用实质上就是将新的namespace里的veth网卡的配置信息通过proxy进程传输出来,并且利用该信息对tap进行相同的配置,最终用tap模拟新的namespace里的vet ...

  10. 最小生成树 kruskal算法 codevs 1638 修复公路

    1638 修复公路  时间限制: 1 s  空间限制: 256000 KB  题目等级 : 钻石 Diamond 题解       题目描述 Description A地区在地震过后,连接所有村庄的公 ...