IE类兼容一
X-UA-Compatible是自从IE8新加的一个设置,对于IE8以下的浏览器是不识别的。
通过在meta中设置X-UA-Compatible的值,可以指定网页的兼容性模式设置。
在网页中指定的模式优先权高于服务器中(通过HTTP Header)所指定的模式。
兼容性模式设置优先级:
|
1
|
meta tag > http header
|
常用的例子:
|
1
2
3
4
5
6
7
8
9
10
|
<meta http-equiv="X-UA-Compatible" content="IE=7">
#以上代码告诉IE浏览器,无论是否用DTD声明文档标准,IE8/9都会以IE7引擎来渲染页面。
<meta http-equiv="X-UA-Compatible" content="IE=8">
#以上代码告诉IE浏览器,IE8/9都会以IE8引擎来渲染页面。
<meta http-equiv="X-UA-Compatible" content="IE=edge">
#以上代码告诉IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染页面。
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">
<meta http-equiv="X-UA-Compatible" content="IE=7,9">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
#以上代码IE=edge告诉IE使用最新的引擎渲染网页,chrome=1则可以激活Chrome Frame.
|
“IE=Edge,chrome=1″这样简单快捷,但是弊端是代码将无法通过W3C验证。其实这并不是问题,毕竟标准只是标准,如果只有这一个“错误”完全不会有任何不良的影响。
IE文档兼容性模式所有可能的值:
|
1
2
3
4
5
6
|
Emulate IE8 mode #指示IE使用<!DOCTYPE>指令来决定如何编译内容。Standards mode指令会显示成IE8 Standards mode而quirks mode会显示成IE5 mode。不同于IE8 mode,Emulate IE8 mode重视<!DOCTYPE>指令。
Emulate IE7 mode #指示IE使用<!DOCTYPE>指令来决定如何编译内容。Standards mode指令会显示成IE7 Standards mode而quirks mode会显示成IE5 mode。不同于IE7 mode,Emulate IE7 mode重视<!DOCTYPE>指令。对于许多网页来说这是最推荐的兼容性模式。
IE5 mode #编译内容如同IE7的quirks mode之显示状况,和IE5中显示的非常类似。
IE7 mode #编译内容如同IE7的standards mode之显示状况,无论网页是否含有<!DOCTYPE>指令。
IE8 mode #提供对业界标准的最高支持,包含 W3C Cascading Style Sheets Level 2.1 Specification和W3C Selectors API,并有限的支持 W3C Cascading Style Sheets Level 3 Specification (Working Draft)。
Edge mode #指示IE以目前可用的最高模式显示内容。当使用IE8时其等同于IE8 mode。若(假定)未来放出支持更高兼容性模式的IE,使用Edge mode的页面会使用该版本能支持的最高模式来显示内容。同样的那些页面在使用IE8浏览时仍会照常显示。
|
注意事项:
1,根据官网定义X-UA-compatible 标头不区分大小写;不过,它必须显示在网页中除 title 元素和其他 meta 元素以外的所有其他元素之前。如果不是的话,它不起作用
2,content的内容是IE=8,或者IE=edge等值,注意不是IE8或者直接写个edge的值,否则不起作用
如果对WEb服务器了解,可以直接配置一下VirtualHost:
Apache:
|
1
2
3
4
5
6
7
8
|
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
BrowserMatch MSIE ie
Header set X-UA-Compatible "IE=Edge" env=ie
BrowserMatch chromeframe gcf
Header append X-UA-Compatible "chrome=1" env=gcf
</IfModule>
</IfModule>
|
Nginx: 详细参考:例子
|
1
|
add_header "X-UA-Compatible" "IE=Edge,chrome=1";
|
参考:
http://lightcss.com/add-x-ua-compatible-meta-to-your-website/
http://desert3.iteye.com/blog/1638591
IE类兼容一的更多相关文章
- Java解析Excel工具类(兼容xls和xlsx)
依赖jar <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi-ooxml&l ...
- Excel导入工具类兼容xls和xlsx
package com.bj58.finance.platform.operation.provider.util; import org.apache.log4j.Logger; import or ...
- 前端导出Excel兼容写法
今天整理出在Web前端导出Excel的写法,写了一个工具类,对各个浏览器进行了兼容. 首先,导出的数据来源可能有两种: 1. 页面的HTML内容(一般是table) 2. 纯数据 PS:不同的数据源, ...
- placeholder的兼容处理(jQuery下)
这是一个老问题,结合前辈们的经验,需要处理的问题有一下几个. 1.只有输入框(input/textarea)下的palaceholder属性存在的时候才需要处理这类兼容 2.处理好输入框上焦点和是焦点 ...
- C#代码示例_定义类
默认情况下,类声明为内部的,即只有当前项目中的代码才能访问它.可以使用internal访问修饰符关键字显示指定. 除了两个访问修饰符关键字(public, internal)外,还可以指定类是抽象的( ...
- joda jar日期处理类的学习
转载:http://www.open-open.com/lib/view/open1348032952724.html 任何企业应用程序都需要处理时间问题.应用程序需要知道当前的时间点和下一个时间点, ...
- C#定义类成员
1.成员定义 public--成员可以由任何代码访问. private--成员只能由类中的代码访问(如果没有使用任何关键字,就默认使用这个关键字). internal--成员只能由定义它的程序集(项目 ...
- Java入门篇(五)——Java的字符串/String类
前面在举例时有出现过String的例子,当时肯定有一部分朋友不知道这个是做什么用的.其实String类是Java中一个比较特殊的类,字符串即String类,它不是Java的基本数据类型之一,但可以像基 ...
- CSS3新增伪类--好用的:target
问:如果让你实现下图,点击跳转后,让内容1增加一个背景颜色,你会怎么做呢? 可能很多小伙伴第一反应是用JS,给跳转绑定点击事件,然后用DOM获取到内容1,在给其添加css样式. 如果我跟你说用cs ...
随机推荐
- BroadcastReceiver 翻译
1. 动态注册与退出 If registering a receiver in your Activity.onResume() implementation, you should unregist ...
- java7(2)——使用mutilcatch注意事项
从java7推出mutilcatch后,到现在都少有看到人使用,可能是这个功能真正用起来,比起多个catch并不快多少,而且现在的工IDE具太厉害了,什么都有快捷键!说是这么说,我们还是得了解一下如何 ...
- Redhat 7.4更新为Centos7的yum并安装docker-ce
以下命令请在root下执行 #删除原有的yum rpm -qa|grep yum|xargs rpm -e --nodeps #install centos yum #wget http://mirr ...
- OpenStack学习(一)
学习主要参考博文:https://www.cnblogs.com/CloudMan6/p/5233484.html 这个系列,,这里只是列出自己实际操作碰到的问题 一.安装系统:ubuntu 16.0 ...
- netty7---自定义序列化接口
package com.cn.core; import java.nio.ByteOrder; import java.nio.charset.Charset; import java.util.Ar ...
- 详解Java中的clone方法 -- 原型模式
转自: http://blog.csdn.net/zhangjg_blog/article/details/18369201 Java中对象的创建 clone顾名思义就是复制, 在Java语言中, ...
- Atom中设置你的Snippet,atom技巧(二)
我们经常需要对二维数组进行迭代,比如这样: for(int x = 0; x < width; x++){ for(int y = 0; y < height; y++){ screen[ ...
- php 中处理 websocket
http://www.cnblogs.com/hustskyking/p/websocket-with-php.html 下面我画了一个图演示 client 和 server 之间建立 websock ...
- Windos 系统网络连接 调优
1.运行进入注册表:regedit 2.进入注册表指定路径 [HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\Tcpip\Parameters ...
- 深入 CommonJs 与 ES6 Module
目前主流的模块规范 UMD CommonJs es6 module umd 模块(通用模块) (function (global, factory) { typeof exports === 'obj ...