HTML5 声明兼容IE的写法

   2015-11-06 0
核心提示:无意中看到百度的页面代码,想到了一种声明写法,需要的朋友可以参考下。
<!DOCTYPE html>是HTML5的声明,主流的游览器中只有IE8及以下版本不支持,这样IE会进入Quirks模式。但之后的声明可以强制指定IE的呈现模式,所以<!DOCTYPE html>声明对IE就无影响。

HTML5并没有XHTML那么严格,对于一般的xhtml页面,基本都不通完全通过W3C验证标准,而改为HTML5声明后基本都能过。


复制代码
代码如下:

<!DOCTYPE html>
<!–[if IE]>
<meta http-equiv=”X-UA-Compatible” content=”IE=8″ />
<![endif]–>
<!–[if IE 7]>
<meta http-equiv=”X-UA-Compatible” content=”IE=7″ />
<![endif]–>
<!–[if IE 6]>
<meta http-equiv=”X-UA-Compatible” content=”IE=6″ />
<![endif]–>

关于X-UA-Compatible
目前绝大多数网站都用

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

来作为IE8的兼容方法,虽然微软将IE向标准迈进了一大步,而事实上IE8还存在一系列渲染的奇怪现象是不争的事实。
谁让IE6那么多呢,或许2014年以后我们可以有更多的时间去关心IE8,而不是IE6或者IE7。
在X-UA-Compatible中可用的方法有:

复制代码
代码如下:

<meta http-equiv="X-UA-Compatible" content="IE=5" >
<meta http-equiv="X-UA-Compatible" content="IE=7" >
<meta http-equiv="X-UA-Compatible" content="IE=8" >
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
[html]
其中最后一行是永远以最新的IE版本模式来显示网页的。
另外加上
[code]
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" >
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >

而使用,Emulate模式后则更重视<!DOCTYPE>

所以目前来说,云下载还是推荐以下

复制代码
代码如下:

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

为首选。
 
标签: 兼容 声明 HTML5
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • 使用create-react-app构建的项目(并引入react-app-polyfill做IE兼容)在开发环境下的IE浏览器中报错的解决方案
    使用create-react-app构建的项目(并引入react-
    个人所负责的一个项目,需要兼容IE11,所以已经按照react-app-polyfill官方指定的方案进行兼容配置即在项目src/index.js中:// The first lines in src/index.jsimport 'react-app-polyfill/ie11';import 'react-app-polyfill/stable';// other codes并在pack
    03-08
  • IE兼容问题,各类css hack代码(亲测有效)
    现在大部分企业对浏览器兼容要求是IE7+或者IE8+,要求IE6的很少,此处一并写出。IE6:_margin-top: 20px;IE6+IE7:*margin-top: 20px;+margin-top: 20px;IE6+:margin-top: 20px\9;IE8+:margin-top: 20px\0;IE9:/*:root在谷歌浏览器中也能被识别,所以需要加
    03-08
  • CSS兼容各种浏览器的一些写法 css兼容各种浏览
    1.DOCTYPE 影响 CSS 处理2.FF: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行3.FF: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中4.FF: 设置 padding 后, di
    03-08
  • iphone safari浏览器CSS兼容性的解决方案集合
     1、iphone safari不兼容CSS的active的解决方案如下:body ontouchstart="" onmouseover=""/body 参考链接:http://stackoverflow.com/questions/8330559/hover-effects-using-css3-touch-events1、iphone safari不兼容CSS的active的解决方案如下:body ont
    03-08
  • Windows和Mac两种操作系统下CSS不兼容问题的解
    这两天碰到一个问题,就是一个小图标的大小和定位的位置在不同的操作系统下是不一样的。查了下资料,自己解决出来了,整理如下:html:i :class="['cursor-pointer', {'windows' : windows}, {'mac': mac}]"     @click="openProductDetail(scope.row.rep
    03-08
  • html5 CSS input placeholder兼容性处理
    1.HTML5对Web Form做了许多增强,比如input新增的type类型、Form Validation等。Placeholder是HTML5新增的另一个属性,当input或者textarea设置了该属性后,该值的内容将作为灰字提示显示在文本框中,当文本框获得焦点时,提示文字消失。以前要实现这效果都是
    03-08
  • html5有哪些新特性、移除了那些元素?如何处理H
    新特性:1. 拖拽释放(Drag and drop) API2. 语义化更好的内容标签(header,nav,footer,aside,article,section)3. 音频、视频API(audio,video)4. 画布(Canvas) API5. 地理(Geolocation) API6. 本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢
    03-08
  • CSS样式渐变代码,兼容IE8 css 设置渐变
    background: -webkit-linear-gradient(top,#ffffff,#f5f5f5);background: -moz-linear-gradient(top,#ffffff,#f5f5f5);background: -webkit-gradient(linear, top, bottom,from(#ffffff),to(#f5f5f5));background: linear-gradient(top,#ffffff,#f5f5f5);back
    03-08
  • CSS中设置DIV垂直居中的N种方法 兼容IE浏览器
      在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中的确是有vertical-align属性,但是它只对(X)HTML元素中拥有valign特
    03-08
  • css3在不同型号手机浏览器上的兼容一览表
     css3总结: 对于webkit内核的浏览器, 除media、text-shadow外,使用其它属性基本上要加上webkit前缀. gradient在低版本的系统中渲染效果不丰富ios3.2~4.3不支持position:fixed,不推荐使用android2.1~2.3对动画的支持效果不丰富android2.1~2.3不支持trans
    03-08
点击排行