关于IE条件注释(译)

时间:2022-09-07 19:12:36
本文翻译自此篇文章。翻译纯属业余。
许多网站为了确保他们的站点能够在不同的浏览器上有不同的显示效果而使用特征检测,一些传统的网站使用其他技术,诸如在服务器或客户端上使用脚本去检测浏览器类型。在这里我们引入比使用脚本检测浏览器更有优势的方法--条件注释。条件注释可以轻易地更早发现早期的IE版本。条件注释是层叠样式表(CSS)用于区分IE特定版本的首选方式。
重要提示 自IE10起,标准模式不再支持条件注释。而是采用特征检测给浏览器不支持的功能来提供备用策略。有关标准模式的详细信息,请参阅定义文档兼容性。
 
下面是本文要讨论的主题:
 
术语
熟悉下列术语有助于你学习文档兼容性。 

名词

描述
expression 由运算符、特征和(或)值组合形成一个条件语句
downlevel browser 任何浏览器除了IE5+,其他低版本浏览器不支持条件注释
uplevel browser IE5+支持条件注释
downlevel-hidden 低版本浏览器会忽视条件注释。如果表达式为true时,IE5+会渲染HTML页面
downlevel-revealed 低版本浏览器经过条件注释的解析。如果表达式为true时,IE5+会渲染HTML页面

使用条件注释的好处

下列表格中展示了基本语法类型,第一个注释是最基本的HTML注释。表格比较并展示每一种条件注释的不同语法的用法。

注释类型 语法或可能的值
HTML标准注释 <!-- Comment content  -->
downlevel-hidden <!--[if expression]> HTML <![endif]-->
downlevel-revealed <![if expression]> HTML <![endif]>
 
expression是由功能、操作符和值组成的。下表列出了支持的功能,并介绍了每个功能支持的值。
  
Item Example 注释
IE [if IE] 对应IE的版本功能来查看该网页
value [if IE 7] 一个整数或浮点标号对应于浏览器的版本。如果是与版本号匹配的浏览器版本,则返回true。
WindowsEdition [if WindowsEdition] Windows 7的IE8。  "WindowsEdition"对应Windows的版本功能。
value [if WindowsEdition 1] 整数对应Windows版本。如果正在使用的的值相匹配,则返回true。
true [if true] 结果始终为true.
false [if false] 结果始终为false.

下表描述了可用于创建条件表达式的运算符。

Item Example 注释
! [if !IE] NOT运算符.。被放置在要素、运算符或表达式之前,扭转表达式的布尔含义。
lt [if lt IE 5.5] 小于运算符。如果第一个参数小于第二个参数,返回true。
lte [if lte IE 6] 小于或等于运算符。如果第一个参数小于或等于第二个参数,返回true。
gt [if gt IE 5] 大于运算符。如果第一个参数大于第二个参数,返回true。
gte [if gte IE 7] 大于或等于运算符。如果第一个参数大于或等于第二个参数,返回true。
( ) [if !(IE 7)] 子表达式运算符。配合使用布尔运算符来创建更复杂的表达式。
& [if (gt IE 5)&(lt IE 7)] AND运算符。如果所有的子表达式的值为真,返回true。
| [if (IE 6)|(IE 7)] OR运算符。如果任何一个子表达式的计算结果为true,返回true。

Downlevel-hidden条件注释

此示例显示了一个低版本隐藏的条件注释,其中包含文本。

 <!--[if IE 8]>
<p>Welcome to Internet Explorer 8.</p>
<![endif]-->
Downlevel-hidden条件注释类似于基本的HTML注释,包含连字符(“ - ”)在开启和关闭标签。条件显示在标签的开口部,和[ENDIF]被放置在标签的封闭部分之前。内容放在注释标签内。
因为前四个字符和注释的最后三个字符是相同的HTML注释元素,所以低版本浏览器会忽略注释块内的HTML内容。由于内容被有效地不支持条件注释的浏览器隐藏,这种类型的条件注释被称为低版本隐藏。
如果条件表达式的结果为真,则对注释块里面的内容进行分析,并通过Internet Explorer 5及更高版本的渲染。针对Internet Explorer而专门设计的内容,这种做法特别有效。
下一个示例演示了如何在客户端脚本块放置一个条件注释;在这种情况下,消息在IE5+浏览器如何显示的。
 <!--[if gte IE 7]>
<script>
alert("Congratulations! You are running Internet Explorer 7 or a later version of Internet Explorer.");
</script>
<p>Thank you for closing the message box.</p>
<![endif]--> 
在上面的例子中,浏览器的版本只有主要的数字进行比较,因为它是在条件表达式指定的唯一数字。要比较这两个主要和次要版本号,要同时指定数字。
 
ownlevel-revealed条件注释
ownlevel-revealed条件注释允许在不承认条件注释的浏览器上包含内容。尽管条件注释被忽略,但它包含的HTML内容却没有被忽略。如果条件为true,IE5+仍然解析和渲染内容。ownlevel-revealed条件注释和Downlevel-hidden条件注释是互补的。
下面片段展示了一个典型的低版本条件注释:
 <![if lt IE 8]>
<p>Please upgrade to Internet Explorer version 8.</p>
<![endif]>

当比较这种类型HTML注释时,发现在注释块在"<!"和 ">"之后(前)没有连字符("--") ,因此,注释分隔符被视为无法识别的HTML。因为浏览器不能识别Downlevel-hidden条件注释,那么它就什么都不做了。

版本号

条件表达式可以用来确定查看网页浏览器的版本或Windows上用于运行浏览器的版本。在这两种情况下,表达式的值称为版本号,必须正确地指定,以获得所需的结果。
检测浏览器的版本时,主要的浏览器版本被指定为整数。要检查是否有轻微的浏览器版本,版本号遵循由一个小数点和四位数组成的规则。例如,微软的Internet Explorer5.5的发布版本的版本载体是5.5000。
在下面的例子中,仅主要版本号被指定。
 <!--[if IE 5]>
<p>Welcome to any incremental version of Internet Explorer 5!</p>
<![endif]-->
下面的测试正确地识别Internet Explorer 5。
 <!--[if IE 5.0000]>
<p>Welcome to Internet Explorer 5.0!</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]--> <!--[if true]>You are using an <em>uplevel</em> browser.<![endif]-->
<![if false]>You are using a <em>downlevel</em> browser.<![endif]> <!--[if true]><![if IE 7]><p>This nested comment is displayed in IE 7.</p><![endif]><![endif]-->

关于IE条件注释(译)的更多相关文章

  1. 浏览器兼容处理&lpar;HTML条件注释、CSSHack和JS识别&rpar;

    前面的话 本文中所有IEx+代表包含x及x以上:IEx-代表包含x及x以下,仅个人习惯.例:IE7+代表IE7.IE8…… 本文中所有例子全部经过测试,欢迎交流. HTML识别 条件注释法(IE10+ ...

  2. IE条件注释详解

    IE条件注释是微软从IE5开始就提供的一种非标准逻辑语句,作用是可以灵活的为不同IE版本浏览器导入不同html元素,如:样式表,html标签等.很显然这种方法的最大好处就在于属于微软官方给出的兼容解决 ...

  3. JScript中的条件注释详解(转载自网络)

    JScript中的条件注释详解-转载 这篇文章主要介绍了JScript中的条件注释详解,本文讲解了@cc_on.@if.@set.@_win32.@_win16.@_mac等条件注释语句及可用于条件编 ...

  4. IE中的条件注释&lpar;转载自网络&rpar;

    IE条件注释是微软从IE5开始就提供的一种非标准逻辑语句,作用是可以灵活的为不同IE版本浏览器导入不同html元素,如:样式表,html标签等.很显然这种方法的最大好处就在于属于微软官方给出的兼容解决 ...

  5. 前端备忘录 — IE 的条件注释

    CSS hack 由于不同厂商的浏览器,比如 Internet Explorer,Safari,Mozilla Firefox, Chrome 等,或者是同一厂商的浏览器的不同版本,如 IE6 和 I ...

  6. 关于CSS中对IE条件注释的问题

    一.通用区分方式:IE6.IE7能识别*,标准浏览器(如FF)不能识别*:IE6能识别*,但不能识别 !important:IE7能识别*,也能识别 !important:IE8能识别\0,不能识别* ...

  7. IE的条件注释

    <!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]--> <!--[if IE]> 所有的IE可识别 <![ ...

  8. 条件注释判断IE浏览器

    最近在用jquery 2.0 才知道已不支持IE6/7/8 但又不想换回 jquery 1.X; 找了一资料发现条件注释可以解决这个问题 这个也像程序中的条件判断,先来介绍几个单词lt :Less t ...

  9. HTML中的IE条件注释

    IE条件注释是一种特殊的HTML注释,这种注释只有IE5.0及以上版本才能理解.比如普通的HTML注释是: <!--This is a comment--> 而只有IE可读的IE条件注释是 ...

随机推荐

  1. 苹果审核Metadata Rejected

    最近提交了 公司的一个 app,收到了appStore拒绝的信息及邮件 拒绝后的状态改为了:metadata rejected 邮件里面有这样一句话 意思大致就是: 你的app先被显示为 Metada ...

  2. htm、html、shtml区别

    htm.html.shtml都是静态网页的后缀,三者也可以说都是只是扩展名不同,其他一样,都是静态的网页. htm和html是完全静态的网页不通过服务器编译解释直接送出给浏览器读取的静态网页,以htm ...

  3. RII K25A 语音空中飞鼠 红外学习步骤

    1.按住多功能遥控器上的SET按键,超过4秒不要放手,LED指示灯会闪一次,然后长亮.2.将多功能遥控器的红外口对准你原来的遥控器的红外口,然后按RII多功能遥控器面上任何按钮,上面灯将会闪动,闪动过 ...

  4. 错误:You can&&num;39&semi;t specify target table &&num;39&semi;xxx&&num;39&semi; for update in FROM clause的解决

    问题: 今天在MySQL数据库删除重复数据的时候遇到了一个问题.如下脚本: DELETE FROM tempA WHERE tid IN ( SELECT MAX(tid) AS tid FROM t ...

  5. Python Cookbook&lpar;第3版&rpar;中文版:15&period;15 C字符串转换为Python字符串

    15.15 C字符串转换为Python字符串¶ 问题¶ 怎样将C中的字符串转换为Python字节或一个字符串对象? 解决方案¶ C字符串使用一对 char * 和 int 来表示, 你需要决定字符串到 ...

  6. LeetCode 427 Construct Quad Tree 解题报告

    题目要求 We want to use quad trees to store an N x N boolean grid. Each cell in the grid can only be tru ...

  7. Python之路-python基础一

    本章内容:       一.编程语言分类       二.python之变量介绍       三.python交互命令(input,print,getpass)       四.Python之循环控制 ...

  8. Floyd求最小环!(转载,非原创) 附加习题(原创。)HDU-1599

    //Floyd 的 改进写法可以解决最小环问题,时间复杂度依然是 O(n^3),储存结构也是邻接矩阵 int mincircle = infinity; Dist = Graph; ;k<nVe ...

  9. SharpGL学习笔记&lpar;八&rpar; 矩阵堆栈和变换的综合例子&colon; 机器人

    我们先引入关于"矩阵堆栈"的官方说法: OpenGL的矩阵堆栈指的就是内存中专门用来存放矩阵数据的某块特殊区域.实际上,在创建.装入.相乘模型变换和投影变换矩阵时,都已用到堆栈操作 ...

  10. 修改linux下默认的python版本

    首先在终端输入:python --verison 查看本机默认采用的python 版本 接着进入/usr/local/lib 目录查看当前系统中安装了多少个python版本 如果只有一个,就安装你需要 ...