前言:9月份开始了,大四也真正的到来了。深知自己网页布局还有很大的缺陷,接下来打算从工作中抽时间出来模仿着一些互联网公司的网站。顺便把基础理论知识打好。

  第一个目标:小米官网;后续会把练习的项目放到github上。

  平常自己写代码不是很规范,网页最基础的架构<html></html>一般用的就是DW生成的页面文件。前不久经老大调教,就改用了H5的框架结构。之前对于结构这块没有去想太多,就以为是一个基本要求的结构。今天看小米首页的活动页,看到<meta http-equiv="X-UA-Compatible" content="IE=edge" />。之前看书的时候没注意到这个,查过资料之后,了解到它其实是指定浏览器按某种方式渲染。

  以下为转载资料:

  

对于IE8及以上版本,例如:

   1: <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" />

强制浏览器按照特定的版本标准进行渲染。但不支持IE7及以下版本。如果用分号(;)分隔,对于不同的浏览器版本就有不同的兼容性,例如

   1: <meta http-equiv="X-UA-Compatible" content="IE=7; IE=9" />

以上就表明,将IE8和IE7按照IE7标准渲染,但是IE9还是按照IE9的标准渲染。它允许有不同的向后兼容水平。尽管在真实情况中,你只要选择一种版本:

   1: <meta http-equiv="X-UA-Compatible" content="IE=8" />
 
这对于测试和维护会更加简单。而通常更加有用的方式就是进行仿真模拟
   1: <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

对于IE=EDGE

   1: <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

这意味着,会强制浏览器按照最新的标准去渲染。就像在Google’s CDN使用最新版本的JQuery一样,这是按照最新版本,但也可能由于没有固定的版本而破坏你的布局。

最后,考虑下面这个

   1: <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />

添加”chrome=1“将允许站点在使用了谷歌浏览器内嵌框架(Chrome Frame)的客户端渲染,对于没有使用的,则没有任何影响。

For more information, there is plenty to read here, and if you want to learn about ChromeFrame (which I recommend) you can learn about its implementation here.

PS:X-UA-Compatible是针对 IE8 版本的一个特殊文件头标记,用于为 IE8 指定不同的页面渲染模式,对于ie8之外的浏览器是不识别的。

目前绝大多数网站都用<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ >来作为IE8的兼容方法。为了避免制作出的页面在IE8下面出现错误,建议直接将IE8使用IE7进行渲染。也就是直接在页面的header的meta标签中加入如下代码:

<meta http-equiv=”X-UA-Compatible” content=”IE=7″ />

<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ >

<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE8″ >

但是<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ >仍然是首选。

StackOverFlow原链接;http://stackoverflow.com/questions/14611264/x-ua-compatible-content-ie-9-ie-8-ie-7-ie-edge?answertab=active#tab-top

转载请注明:淡忘~浅思 » 【译】IE 8兼容:X-UA-Compatible的解释

IE 8兼容:<meta http-equiv="X-UA-Compatible" content="IE=edge" /> X-UA-Compatible的解释的更多相关文章

  1. 优先使用最新版本的IE 和 Chrome 内核 1 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    兼容模式 优先使用最新版本的IE 和 Chrome 内核 1 <meta http-equiv="X-UA-Compatible" content="IE=edge ...

  2. < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />的作用

    < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" /> 介绍:这 ...

  3. < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />

    目录(?)[-] 1 meta http-equiv  X-UA-Compatible content  chrome1 1 meta http-equiv  X-UA-Compatible cont ...

  4. <meta http-equiv="X-UA-Compatible" content="IE=Edge">

    1.X-UA-Compatible X-UA-Compatible是IE8的一个专有<meta>属性,它告诉IE8采用何种IE版本去渲染网页,在html的<head>标签中使用 ...

  5. 详解< meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />

    < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" /> 这是个是 ...

  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">的作用

    X-UA-Compatible是针对ie8新加的一个设置,对于ie8之外的浏览器是不识别的. X-UA-Compatible 是针对 IE8 版本的一个特殊文件头标记,用于为 IE8 指定不同的页面渲 ...

  7. < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />的意义

    X-UA-Compatible是神马? X-UA-Compatible是IE8的一个专有<meta>属性,它告诉IE8采用何种IE版本去渲染网页,在html的<head>标签中 ...

  8. <meta content='IE=edge,chrome=1' http-equiv='X-UA-Compatible' />

    代码一:<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> http-eq ...

  9. 指定文件兼容性模式 < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />的意义

    X-UA-Compatible是神马? X-UA-Compatible是IE8的一个专有<meta>属性,它告诉IE8采用何种IE版本去渲染网页,在html的<head>标签中 ...

随机推荐

  1. SpringBoot入门(IDEA篇)(二)

    一.SpringBoot启动的3种方式 第一种:借助IDE工具直接启动 run as 第二种:mvn命令启动 1:打开命令行,进入到项目目录中(我这里还是用上次建立的dog项目来操作)cd E:\Wo ...

  2. TP5.1 查看具体版本

    https://blog.csdn.net/haibo0668/article/details/80865785 echo \think\facade\App::version(); composer ...

  3. [转] 设置linux时间为网络时间

    [From] https://blog.csdn.net/weixin_35852328/article/details/79506453 Linux的时间分为System Clock(系统时间)和R ...

  4. I2C裸机驱动程序设计

    ① I2C(Inter-Integrated Circuit)总线是由飞利浦公司开发的两线式串行总线,用于连接微控制器及其外围设备 ② I2C总线有两根双向信号线 (1)SDA:Serial Data ...

  5. axios简单介绍

    axios的配置,get,post,axiso的同步问题解决 一.缘由 vue-resoure不更新维护,vue团队建议使用axios. 二.axios安装 1.利用npm安装npm install ...

  6. 一篇在一个Excel表中创建多个sheet的代码

    package projectUtil; import org.apache.commons.lang3.StringUtils; import org.apache.poi.hssf.usermod ...

  7. mysql语句插入前判断数据是否重复

    在mysql中插入数据有时需要判断数据插入是否重复 语句编写:insert into 表(相应字段) select 相应字段 from dual where not exists (select 相应 ...

  8. 接口自动化测试框架 :APIAutoTest框架

    前言 随着测试技术的发展,接口自动化测试逐渐成为各大公司投入产出比最高的测试技术.介入时间早,执行效率高,稳定性高的优点,让越来越多的公司引入接口自动化测试. 框架简介 APIAutoTest是处理A ...

  9. 3dsmax2020卸载/安装失败/如何彻底卸载清除干净3dsmax2020注册表和文件的方法

    3dsmax2020提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装3dsmax2020失败提示3dsmax2020安装未完成,某些产品无法安装,也有时候想重新 ...

  10. Mac 下安装mysqldb 问题:一条命令解决mysql_config not found

    遇到过几次pip安装mysql-python的时候出现如题的问题,在这里记录一下解决方法. 找不到mysql_config一般是由于通过lnmp.org或者其他方式安装mysql以后mysql_con ...