未来兼容性中的 META 标记和锁定

注意:本文档是预备文档,随时可能变更。

对于 Web 开发人员来说,文本兼容性是一个要考虑的重要问题。Windows Internet Explorer 8 引入了文本兼容性模式,该模式允许 Web 开发人员将浏览器设置为以与旧版本相同的方式显示网页,从而允许开发人员选择更新时间。


文档将介绍由 Windows Internet Explorer 8
支持的文本兼容性模式,以及如何使用自定义标头基于每个页面或每个站点实现这些模式。实现适当的兼容性模式后,可以确保站点与 Windows
Internet Explorer 8 及更高版本兼容。

各种兼容性模式

Windows Internet Explorer 8 支持多种兼容性模式,它们可启用不同的受支持的功能,并影响内容的呈现方式。例如,

IE5 模式呈现内容时,像是使用了 Windows Internet Explorer 7 的 Quirks 模式,这与 Windows Internet Explorer 5 显示内容的方式很相似。

IE7 模式呈现内容时,无论页面是否包含 <!DOCTYPE> 指令,都像是使用了 Windows Internet Explorer 7 的标准模式。

EmulateIE7
模式通知 Windows Internet Explorer 使用 <!DOCTYPE> 指令确定如何呈现内容。标准模式指令以
Windows Internet Explorer 7 标准模式显示,而 Quirks 模式指令以 IE5 模式显示。与 IE7
模式不同,EmulateIE7 模式遵循 <!DOCTYPE> 指令。对于多数网站来说,它是首选的兼容性模式。

IE8 模式最大限度地支持行业标准(包括 W3C Cascading Style Sheets Level 2.1 SpecificationW3C Selectors API,并能有限支持 W3C Cascading Style Sheets Level 3 Specification(工作草案)

Edge
模式通知 Windows Internet Explorer 以最高级别的可用模式显示内容,这实际上破坏了“锁定”模式。对于 Windows
Internet Explorer 8,这与 IE8 模式是等效的。如果(假定)Windows Internet Explorer
的未来版本支持更高级别的兼容模式,设置为 Edge 模式的页面将显示在由该版本支持的最高级别模式中;但是,当使用 Windows
Internet Explorer 8 查看时,这些相同的页面仍将显示在 IE8 模式中。由于在 Windows Internet
Explorer 的未来版本中呈现页面内容可能出现意外,建议 Web 开发人员将 Edge 模式仅用于测试页面和其他非生产活动。

基于每个页面指定兼容性模式

要为网页指定文本模式,请使用 META 元素,以在该网页中包含 X-UA-Compatible http-equiv 标头。以下示例指定了 EmulateIE7 模式兼容性。

HTML:

<html>
<head>
<!-- Mimic Internet Explorer 7 -->
<title>我的网页</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />   
</head>   
<body>      
<p>内容在此处。</p>   
</body>
</html>

Content 属性指定了该页面的模式;例如,要模仿 Windows Internet Explorer 7 的行为,请指定 IE=EmulateIE7。同样,可指定 IE=5、IE=7 或 IE=8 以选择其中一种兼容性模式。您还可以指定 IE=edge 以通知 Windows Internet Explorer 8 使用最高级别的可用模式。

X-UA-compatible 标头不区分大小写;但是,它必须显示在网页中除 TITLE 和其他 META 元素以外的所有元素之前的标头(HEAD 部分)中。

基于每个站点指定兼容模式

通过使用 Web 服务器为站点定义自定义 HTTP 响应标头,可为网站指定文本模式。HTTP 响应标头是 Web 服务器附加到为响应 HTTP 请求而发送到浏览器中的文件的信息,这些信息通常包含发送回文件的日期、大小和类型。

下列文档介绍了将 Web 服务器配置为将自定义 HTTP 响应标头附加到所有网页中所需的步骤。这将导致 Windows Internet Explorer 8 使用指定的文本兼容性模式,例如 EmulateIE7。

在 IIS 上实现 META 切换
在 Apache 上实现 META 切换

如果使用 Web 服务器指定了默认文本兼容性模式,则可通过在特定的网页中指定其他文本兼容性模式来覆盖该设置。在该网页中指定的模式优先于由服务器指定的模式。

使用脚本确定文本兼容性模式

要使用 Windows Internet Explorer 8 确定网页的文本兼容性模式,请使用 document 对象的 documentMode 属性。例如,将以下内容键入到 Windows Internet Explorer 8 的地址栏中,可显示当前网页的文本模式。

javascript:alert(document.documentMode);

documentMode 属性可返回与页面的文本兼容性模式相对应的数值。例如,如果所选页面支持 IE8 模式,则 documentMode 会返回 8。

注意:在 Windows Internet Explorer 6 中引入的 compatMode
属性已不受支持,取而代之的是在 Windows Internet Explorer 8 中引入的 documentMode 属性。当前使用
compatMode 的应用程序仍然可以在 Windows Internet Explorer 8 中运行;但是,它们已更新为使用
documentMode。

如果希望使用 JavaScript 确定文本的兼容性模式,请在其中包含支持 Windows Internet Explorer 旧版本的代码,如以下示例所示。

JScript:

engine = null;  
if (window.navigator.appName == "Microsoft Internet Explorer") {   
// 这是一个 IE 浏览器。引擎处于哪种模式下?
if (document.documentMode) // IE8     
engine = document.documentMode;
else // IE 5-7 {      
engine = 5; // 假设为 quirks 模式;除非另外证实是其他模式      
if (document.compatMode){         
if (document.compatMode == "CSS1Compat")            
engine = 7; // 标准模式      
}   
}   
// 引擎变量现在包含文本兼容性模式。
}

此处使用的文档对象表示给定浏览器窗口中的 HTML 文档,可用来检查、修改 HTML 文档或将内容添加到该文档以及处理该文档中的事件。

使用条件注释确定文本兼容性模式

如果只需要适应 Windows Internet Explorer,以下代码示例说明了如何使用条件注释来适用于当前版本或旧版本。

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">  
<html>   
<head>      
<title>测试页</title>      
<meta http-equiv="X-UA-Compatible" content="IE=8"/>      
<!--[if gte IE 8]>      
<style type="text/css">      
body {color:#0000ff;}      
</style>      
<![endif]-->      
<!--[if lt IE 8]>      
<style type="text/css">      
body {color:#000000;background-color:#ffffff; }      
</style>      
<![endif]-->   
</head>   
<body>      
<h1><!--[if gte IE 8]>第 1 章。<![endif]-->第一章</h1><h1>      
<!--[if gte IE 8]>第 2 章。<![endif]--> 第二章</h1>
将看到任何版本的文本。
</body> X-UA-Compatible是针对ie8新加的一个设置,对于ie8之外的浏览器是不识别的,这个区别与 content="IE=7"在无论页面是否包含<!DOCTYPE>指令,都像是使用了 Windows Internet Explorer 7的标准模式。而content="IE=EmulateIE7"模式遵循<!DOCTYPE>指令。对于多数网站来说,它是首选的兼容性模式。
目前IE8尚在测试版中,所以为了避免制作出的页面在IE8下面出现错误,建议直接将IE8使用IE7进行渲染。也就是直接在页面的header的meta标签中加入如下代码:
<meta http-equiv="X-UA-Compatible" content="IE=7" />  这样我们才能使得页面在IE8里面表现正常!

<META http-equiv=X-UA-Compatible content=IE=EmulateIE7>的更多相关文章

  1. 简单物联网:外网访问内网路由器下树莓派Flask服务器

    最近做一个小东西,大概过程就是想在教室,宿舍控制实验室的一些设备. 已经在树莓上搭了一个轻量的flask服务器,在实验室的路由器下,任何设备都是可以访问的:但是有一些限制条件,比如我想在宿舍控制我种花 ...

  2. 利用ssh反向代理以及autossh实现从外网连接内网服务器

    前言 最近遇到这样一个问题,我在实验室架设了一台服务器,给师弟或者小伙伴练习Linux用,然后平时在实验室这边直接连接是没有问题的,都是内网嘛.但是回到宿舍问题出来了,使用校园网的童鞋还是能连接上,使 ...

  3. 外网访问内网Docker容器

    外网访问内网Docker容器 本地安装了Docker容器,只能在局域网内访问,怎样从外网也能访问本地Docker容器? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Docker容器 ...

  4. 外网访问内网SpringBoot

    外网访问内网SpringBoot 本地安装了SpringBoot,只能在局域网内访问,怎样从外网也能访问本地SpringBoot? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装Java 1 ...

  5. 外网访问内网Elasticsearch WEB

    外网访问内网Elasticsearch WEB 本地安装了Elasticsearch,只能在局域网内访问其WEB,怎样从外网也能访问本地Elasticsearch? 本文将介绍具体的实现步骤. 1. ...

  6. 怎样从外网访问内网Rails

    外网访问内网Rails 本地安装了Rails,只能在局域网内访问,怎样从外网也能访问本地Rails? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Rails 默认安装的Rails端口 ...

  7. 怎样从外网访问内网Memcached数据库

    外网访问内网Memcached数据库 本地安装了Memcached数据库,只能在局域网内访问,怎样从外网也能访问本地Memcached数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装 ...

  8. 怎样从外网访问内网CouchDB数据库

    外网访问内网CouchDB数据库 本地安装了CouchDB数据库,只能在局域网内访问,怎样从外网也能访问本地CouchDB数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Cou ...

  9. 怎样从外网访问内网DB2数据库

    外网访问内网DB2数据库 本地安装了DB2数据库,只能在局域网内访问,怎样从外网也能访问本地DB2数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动DB2数据库 默认安装的DB2 ...

  10. 怎样从外网访问内网OpenLDAP数据库

    外网访问内网OpenLDAP数据库 本地安装了OpenLDAP数据库,只能在局域网内访问,怎样从外网也能访问本地OpenLDAP数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动 ...

随机推荐

  1. Dynamic Web Module 3.0 requires Java 1.6 or newer

    在maven工程的pom.xml文件中加入如下代码: 在<build>里面加入如下代码: <plugins> <plugin> <groupId>org ...

  2. static总结

    [本文链接] http://www.cnblogs.com/hellogiser/p/static.html [分析] [内存分配方式] 在C++中,内存分成5个区,他们分别是堆.栈.自由存储区.全局 ...

  3. Android app主线程UI更新间歇性崩溃的问题

    对App进行开发测试时,偶尔出现app崩溃的问题.日志如下: 10-25 18:44:52.935 15290-15290/com.zzq.cnblogs E/AndroidRuntime﹕ FATA ...

  4. ndk编译protobuf库

    ndk_r9编译通过,里面带了自动生成代码的脚本(tool/createPBFile.bat). 下载地址

  5. iOS 利用self.navigationItem.backBarButtonItem修改后退按钮文字

    @property(nonatomic,retain) UIBarButtonItem *backBarButtonItem; // Bar button item to use for the ba ...

  6. Sql Server 深入的探讨锁机制

    一: 当select遇到性能低下的update会怎么样? 1. 还是使用原始的person表,插入6条数据,由于是4000字节,所以两条数据就是一个数据页,如下图: 1 DROP TABLE dbo. ...

  7. vector.end() 指向的节点

    存储器vector, vector.end() 指向的是最后的结束符,而不是最后一个元素.

  8. 强制JSP页面刷新,防止被服务器缓存(可用于静态include强制刷新)

    对于jsp页面,为了防止页面被服务器缓存.始终返回同样的结果. 通常的做法是在客户端的url后面加上一个变化的参数,比如加一个当前时间. 我现在使用的方法是在jsp头部添加以下代码: <%    ...

  9. 补丁vs错误(codevs 2218 错误答案)

    题目描述 Description 错误就是人们所说的Bug.用户在使用软件时总是希望其错误越少越好,最好是没有错误的.但是推出一个没有错误的软件几乎不可能,所以很多软件公司都在疯狂地发放补丁(有时这种 ...

  10. unsatisfied类型的异常

    一般为libs包下arm64-v8a,armeabi,armeabi-v7a,mips,mips64,x86,x86_64等文件夹下的.so文件丢失. 一般情况,armeabi下的so文件需要拷贝一份 ...