<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 的说明
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里面表现正常!
浏览器市场份额的激烈竞争,给网页设计开发人员带来了兼容性设计的麻烦。单单 IE 浏览器就有好几个主流版本,IE6、IE7、IE8 等等。当然使用诸如 IETester,多版本 IE 共存解决方案之类的第三方集成工具,可以方便代码调试。但我们总需要找寻一种更为省时省力的方法。
X-UA-Compatible 是针对 IE8 版本的一个特殊文件头标记,用于为 IE8 指定不同的页面渲染模式。由于当下 IE6 和 IE7 使用率依然较高,综合考虑,启用 IE8 版本的 X-UA-Compatible 兼容模式显得相当重要。
各种兼容模式代码示例如下:
<meta http-equiv="X-UA-Compatible" content="IE=5" />
像是使用了 Windows Internet Explorer 7 的 Quirks 模式,这与 Windows Internet Explorer 5 显示内容的方式很相似。
<meta http-equiv="X-UA-Compatible" content="IE=7" />
无论页面是否包含 <!DOCTYPE> 指令,均使用 Windows Internet Explorer 7 的标准渲染模式。
<meta http-equiv="X-UA-Compatible" content="IE=8" />
开启 IE8 的标准渲染模式,但由于本身 X-UA-Compatible 文件头仅支持 IE8 以上版本,因此等同于冗余代码。
<meta http-equiv="X-UA-Compatible" content="edge" />
Edge 模式通知 Windows Internet Explorer 以最高级别的可用模式显示内容,这实际上破坏了“锁定”模式。
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
EmulateIE7 模式通知 Windows Internet Explorer 使用 <!DOCTYPE> 指令确定如何呈现内容。标准模式指令以Windows Internet Explorer 7 标准模式显示,而 Quirks 模式指令以 IE5 模式显示。与 IE7 模式不同,EmulateIE7 模式遵循 <!DOCTYPE> 指令。对于多数网站来说,它是首选的兼容性模式。
在现阶段,IE8 版本推向市场没有多久,份额不高。因此,考虑兼容旧版本的模式值得推荐。
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 的说明的更多相关文章
- 关于<meta name="viewport" content="width= device-width,user-scalable= 0,initial-scale= 1.0,minimum-scale= 1.0">
<meta name="viewport" content=" width= device-width, user-scalable= 0, initial-sca ...
- <head>中<meta name="viewport" content="width=device-width,initical-scale=1"的作用>
<meta name="viewport" content="width=device-width,initical-scale=1"的作用> co ...
- 论meta name= viewport content= width=device-width initial-scale=1 minimum-scale=1 maximum-scale=1的作用
一.先明白几个概念 phys.width: device-width: 一般我们所指的宽度width即为phys.width,而device-width又称为css-width. 其中我们可以获取ph ...
- meta name="viewport" content="width=device-width,initial-scale=1.0" 解释
<meta name="viewport" content="width=device-width,initial-scale=1.0"> c ...
- <meta name="viewport" content="width=device-width, initial-scale=1" />
今天第一次用JQuery Mobile做了个3个手机小页面,一个登陆页面.一个列表页面和一个表单页面,页面中的组件呈现一切正常. 但出现了一个奇怪的问题,登陆页面大小正常,到了列表页面和表单页面就显得 ...
- <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalabl ...
- <meta name="viewport" content="width=device-width, initial-scale=1.0">的说明
今天在做适配手机版时,chrome调到手机版,但是还是显示PC端的样式,无法展现出手机端的样式: 开始的时候还以为是chrome版本的问题,最新版本的chrome62.0是有很多变化的,而之前工作中使 ...
- [HTML] <meta name="viewport" content="width=device-width,initial-scale=1.0">释义
<meta name="viewport" content="width=device-width,initial-scale=1.0">这是 HT ...
- <meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">的作用
本人对该标签理解不深,这里是复制了穆乙的文章:如果有人进来看到这篇文章,请按此https://www.cnblogs.com/pigtail/archive/2013/03/15/2961631.ht ...
- <meta name="viewport" content="width=device-width, initial-scale=1.0">理解
ViewPort <meta>标记用于指定用户是否可以缩放Web页面,如果可以,那么缩放到的最大和最小缩放比例是什么.使用ViewPort <meta>标记还表示文档针对移动设 ...
随机推荐
- Android应用增加计时器
昨天写的Sudoku游戏需要增加计时器功能,使用Chronometer实现如下,由于Chronometer自己在调用stop之后后台的计时器还会继续增加,所以暂停功能需要额外实现: 在StartAct ...
- Unity Sprite切割导出
这次需要将美术提供的Sprite图集切割导出,整体思路依然和上次的Sprite转prefab一致,只是在转prefab的逻辑修改为了创建Texture的逻辑. 过程很简单,直接看最终代码结果: usi ...
- HDU 2176
http://acm.hdu.edu.cn/showproblem.php?pid=2176 nim博弈的模型.要输出先手第一次取的情况,考虑角度是留给对手必败态 #include <iostr ...
- [专题汇总]AC自动机
1.The 2011 ACM-ICPC Asia Dalian Regional Contest ZOJ 3545 Rescue the Rabbit 简单的AC自动机+状压DP, 状态DP[nod ...
- 更新新网卡驱动,修复win7雷凌网卡Ralink RT3290在电脑睡眠时和启动网卡时出现蓝屏netr28x.sys驱动文件错误
更新新网卡驱动,修复win7雷凌网卡Ralink RT3290在电脑睡眠时和启动网卡时出现蓝屏netr28x.sys驱动文件错误 我的本本是win7,雷凌网卡Ralink RT3290 802.1 ...
- Python 基礎 - bytes數據類型
三元運算 什麼是三元運算?請看下圖說明 透過上圖說明後,可以得出一個三元運算公式: result = 值1 if 條件 else 值2, 如果鯈件為真: result = 值1 如果鯈件為假: res ...
- Neo4j 两种索引Legacy Index与Schema Index区别
Legacy Indexes 在Neo4j 2.0版本之前,Legacy index被称作indexes.这个索引是通过外部图存储在外的Lucene实现,允许“节点”和“联系”以key:value键值 ...
- php开发工具。。
看了好多决定用phpstorm. hahaha PHP还是挺好玩的 但是貌似犯蠢一下,MAC自带有php环境: 我还下了一个XAMPP,不过无所谓啦. 都可以用
- Candy Store
Candy Store Time Limit: 30000ms, Special Time Limit:75000ms, Memory Limit:65536KB Total submit users ...
- 2016HUAS_ACM暑假集训2D - 敌兵布阵
刚开始接触线段树,不得不说,每次接触到一个新的数据结构,都会是一场头脑风暴的“盛宴”.希望我能继续痛苦并快乐着学下去.我相信,有各路大神的博客相助,我还是能坚持下去的. 这个题目是HDU的1166,只 ...