文档章节

一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

widely
 widely
发布于 2014/06/20 09:36
字数 891
阅读 338
收藏 30


一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

2012-04-25 16:29:04| 分类: 学习 |字号 订阅
在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案

百度也应用了这种方案去解决IE的兼容问题

百度源代码如下

<!Doctype html>
<html xmlns=http://www.w3.org/1999/xhtml xmlns:bd=http://www.baidu.com/2010/xbdml>
<head>
<meta http-equiv=Content-Type content=“text/html;charset=utf-8″>
<meta http-equiv=X-UA-Compatible content=IE=EmulateIE7>
<title>百度一下,你就知道 </title>
<script>var wpo={start:new Date*1,pid:109,page:‘superpage’}</script>
<meta http-equiv=X-UA-Compatible content=IE=EmulateIE7>

可以打开百度,右键查看源码看下!我们可以看下文件头是否存在这样一行代码!

这句话的意思是强制使用IE7模式来解析网页代码!

在这里送上几种IE使用模式!

<meta http-equiv=“X-UA-Compatible” content=“IE=8″>
2. Google Chrome Frame也可以让IE用上Chrome的引擎:

<meta http-equiv=“X-UA-Compatible” content=“chrome=1″ />
3.强制IE8使用IE7模式来解析

<meta http-equiv=“X-UA-Compatible” content=“IE=EmulateIE7″><!– IE7 mode –>
//或者
<meta http-equiv=“X-UA-Compatible” content=“IE=7″><!– IE7 mode –>
4.强制IE8使用IE6或IE5模式来解析

<meta http-equiv=“X-UA-Compatible” content=“IE=6″><!– IE6 mode –> 

<meta http-equiv=“X-UA-Compatible” content=“IE=5″><!– IE5 mode –> 
5.如果一个特定版本的IE支持所要求的兼容性模式多于一种,如:

<meta http-equiv=“X-UA-Compatible” content=“IE=5; IE=8″ />
二.设定网站服务器以指定预设兼容性模式

如果服务器是自己的话,可以在服务器上定义一个自订标头来为它们的网站预设一个特定的文件兼容性模式。这个特定的方法取决于你的网站服务器。

录入,下列的 web.config文件使Microsoft Internet Information Services (IIS)能定义一个自订标头以自动使用IE7 mode来编译所有网页。

另外还有一起其他的解决方案,例如google的

ie7 – js中是一个JavaScript库(解决IE与W3C标准的冲突的JS库),使微软的Internet Explorer的行为像一个Web标准兼容的浏览器,支持更多的W3C标准,支持CSS2、CSS3选择器。它修复了许多的HTML和CSS问题,并使 得透明PNG在IE5、IE6下正确显示。

使IE5,IE6兼容到IE7模式(推荐)

<!–[if lt IE 7]>
<script src=”http://ie7-js.googlecode.com/svn/version/2.0(beta)/IE7.js” type=”text/javascript”></script>
<![endif]–>
使IE5,IE6,IE7兼容到IE8模式

<!–[if lt IE 8]>
<script src=”http://ie7-js.googlecode.com/svn/version/2.0(beta)/IE8.js” type=”text/javascript”></script>
<![endif]–>
使IE5,IE6,IE7,IE8兼容到IE9模式

<!–[if lt IE 9]>
<script src=”http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js”></script>
<![endif]–>
解决PNG显示问题

只需将透明png图片命名为*-trans.png

需要注意的是:此方法对背景平铺(background-repeat)和背景(background-position)无法起到任何作用,默认会占满整个容器。

转载:http://hi.baidu.com/myplan/blog/item/cdb09dfa1fa748a99f514626.html


三、<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
创建html5时发现这么一句话,不知其什么意思,百度如下:
这样写可以达到的效果是如果安装了GCF,则使用GCF来渲染页面,如果没安装GCF,则使用最高版本的IE内核进行渲染。Google Chrome Frame(谷歌内嵌浏览器框架GCF)。这个插件可以让用户的IE浏览器外不变,但用户在浏览网页时,实际上使用的是Google Chrome浏览器内核,而且支持IE6、7、8等多个版本的IE浏览器。
http://blog.csdn.net/abxn2002/article/details/7312459


本文转载自:http://www.cnblogs.com/yoosou/archive/2012/07/27/2612443.html

共有 人打赏支持
widely
粉丝 3
博文 42
码字总数 1928
作品 0
朝阳
程序员
加载中

评论(1)

许雷神
许雷神
不错,除了引用谷歌地址外
针对IE6\7\8\9\10浏览器的CSS hack大全详解

目前IE内核浏览器仍然是国内主流浏览器,占据着PC浏览器的大部分市场份额,版本从IE6到IE10,所有前段工作者都必须面对和解决多个IE浏览器对代码的兼容性问题。在很多情况下,我们需要专门针...

五月兰
2012/11/04
0
0
IE7、IE8、IE9、IE10后各版本的更新内容和各版本的差别

在程序员的眼里,万恶的IE6的结束对他们而言是一种解脱,IE7首次开始完整支持W3C标准,从此之后IE的标准化之路就开始越走越顺,以下总结了IE7以后各版本的更新内容,和各版本的差别,作为Web...

晨曦之光
2012/03/09
0
0
javascript检测IE6-8,chrome,safari,firefox,opera等主流浏览器类型

javascript检测IE6-8,chrome,safari,firefox,opera等主流浏览器类型 利用javascript检测浏览器的类别,网上也会有很多的代码,这里总结写了一下,主要检测主流的五款浏览器(IE,Chrome,Opera,...

香吉士
2013/11/26
0
0
渴切v3.1发布 新增ie6~ie8多媒体查询响应式支持

渴切-开源中文css框架 发布v3.1.0版 ,新增ie6, ie7 ,ie8 的多媒体响应式查询支持。彻底解决了ie6~ie8不支持响应的问题 ,真正做到了所有浏览器:ie6, ie7,ie8 ,ie9 ,firefox ,chrome ,safari...

tyshymy
2013/07/20
4.1K
16
CSS3实现背景颜色线性渐变gradient

Mozilla 仅针对FireFox linear 表示线性,参数top表示从顶部开始,参数#eee表示开始颜色,#aaa表示结束颜色 效果: Webkit 解决:Chrome 、Safari linear 表示线性、0 0 表示开始位置的x与y...

cd_ing
2014/02/17
0
0

没有更多内容

加载失败,请刷新页面

加载更多

992. Sort Array By Parity II - LeetCode

Question 992. Sort Array By Parity II Solution 题目大意:给一个int数组,一半是奇数一半是偶数,分别对偶数数和奇数数排序并要求这个数本身是偶数要放在偶数位上 思路:把奇数数和偶数数...

yysue
7分钟前
0
0
Snackbar源码分析

目录介绍 1.最简单创造方法 1.1 Snackbar作用 1.2 最简单的创建 1.3 Snackbar消失的几种方式 2.源码分析 2.1 Snackbar的make方法源码分析 2.2 对Snackbar属性进行设置 2.3 Snackbar的show显示...

潇湘剑雨
38分钟前
1
0
分布式作业系统 Elastic-Job-Lite 源码分析 —— 作业数据存储

分布式作业系统 Elastic-Job-Lite 源码分析 —— 作业数据存储 摘要: 原创出处 http://www.iocoder.cn/Elastic-Job/job-storage/ 本文基于 Elastic-Job V2.1.5 版本分享 1. 概述 本文主要分享...

DemonsI
45分钟前
1
0
jmockit demo

1、@Mocked,标识一个指定的class的实例或被测对象的参数被Mock掉。 2、@Capturing,标识一个被Mock的对象,从该对象派生的子类也被Mock了。 3、@Injectable,标识只有一个指定的被测对象的内...

我的老腰啊
59分钟前
1
0
内容换行

用 <textarea>13611112222 这里想换行 13877779999</textarea><textarea>13611112222 13877779999</textarea>...

小黄狗
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部