前言:9月份开始了,大四也真正的到来了。深知自己网页布局还有很大的缺陷,接下来打算从工作中抽时间出来模仿着一些互联网公司的网站。顺便把基础理论知识打好。
第一个目标:小米官网;后续会把练习的项目放到github上。
平常自己写代码不是很规范,网页最基础的架构<html></html>
一般用的就是DW
生成的页面文件。前不久经老大调教,就改用了H5
的框架结构。之前对于结构这块没有去想太多,就以为是一个基本要求的结构。今天看小米首页的活动页,看到<meta http-equiv="X-UA-Compatible" content="IE=edge" />
。之前看书的时候没注意到这个,查过资料之后,了解到它其实是指定浏览器按某种方式渲染。
以下为转载资料:
对于IE8及以上版本,例如:
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" />
强制浏览器按照特定的版本标准进行渲染。但不支持IE7
及以下版本。如果用分号(;
)分隔,对于不同的浏览器版本就有不同的兼容性,例如
<meta http-equiv="X-UA-Compatible" content="IE=7; IE=9" />
以上就表明,将IE8
和IE7
按照IE7
标准渲染,但是IE9
还是按照IE9
的标准渲染。它允许有不同的向后兼容水平。尽管在真实情况中,你只要选择一种版本:
<meta http-equiv="X-UA-Compatible" content="IE=8" />
这对于测试和维护会更加简单。而通常更加有用的方式就是进行仿真模拟
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
对于IE=EDGE
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
这意味着,会强制浏览器按照最新的标准去渲染。就像在Google’s CDN
使用最新版本的JQuery
一样,这是按照最新版本,但也可能由于没有固定的版本而破坏你的布局。
最后,考虑下面这个
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
添加”chrome=1
“将允许站点在使用了谷歌浏览器内嵌框架(Chrome Frame
)的客户端渲染,对于没有使用的,则没有任何影响。
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">
仍然是首选。